Webpack：依赖于jquery使用非模块化JavaScript文件

尽管有许多关于在webpack中使用jquery的问题，但我无法弄清楚如何包含依赖于jquery的JS文件并获得与脚本标记相同的效果。在github或Stack Overflow中提到的每种方法都没有详细解释，也没有一个适用于我。另外，我没有使用webpack的经验。Webpack：依赖于jquery使用非模块化JavaScript文件

我发现那些听起来足够接近我的问题，但他们不回答这个问题，具体如下：question & another question & another。这些问题没有提供实现这一结果的步骤。

概述：我使用的是这个template。我用需要（非模块）JS文件的代码替换了nav-html文件。该文件中的代码不会导出任何内容，并且应该全局运行。

查看此commit为基础模板之前的任何更改。

方法1：包括在webpack.config.vendor.js厂商阵列中的js文件，检查该commit

结果1：我可以看到在vendor.js的代码，但是当我把Chrome开发工具的断点代码未被击中

方法2：在boot.ts中添加了对js文件的require。请注意，它不是一个模块。检查这commit。

结果2：未捕获的ReferenceError：$没有定义

方法3：使用脚本加载器。检查这个commit。

结果3：未捕获的ReferenceError：$没有定义

来源

2017-06-21 Ahmed Mansour

那么，为什么你不想包含使用脚本标签的jQuery？ –

@ChrisG jquery已经包含在vendor.js中为什么再包含它？我看到它的方式，无论是使用webpack将库和依赖关系捆绑在一起，还是一直使用脚本标记。 –

当我将jQuery添加到我的反应应用程序中时，我必须在导入行后添加'/ * global $ * /'。 –

对不起，我没有看过你的代码，但希望这可以帮助。

只需在其中一个模块中创建一个全局变量，就可以将模块中的任何内容暴露给全局范围。

import * as $ from 'JQuery'; 
window.$ = $;

这将允许您的非模块代码引用作为模块加载的Jquery。

来源

2017-07-21 10:58:27 moefinley

Webpack：依赖于jquery使用非模块化JavaScript文件

回答

相关问题