使用Webpack模拟<script>标记

时间:2017-05-17 10:35:33

标签: javascript plugins webpack strophe

我正在尝试将两个库全局导入到项目中。我想要实现的目标可以如下完成(请注意&lt; head&gt; 中的&lt; script&gt; 标签。

&#xA;& #xA;
 &lt; html&gt;&#xA;&lt; head&gt;&#xA;&lt; script src =“node_modules / strophe / strophe.js”&gt;&lt; / script&gt;&#xA; &lt; script src =“node_modules / strophejs-plugins / disco / strophe.disco.js”&gt;&lt; / script&gt;&#xA;&lt; / head&gt;&#xA;&lt; body&gt;&#xA;&lt; div id =“container”&gt;&lt; / div&gt;&#xA;&lt; script src =“bundle.js”charset =“utf-8”&gt;&lt; / script&gt;&#xA;&lt; / body&gt; &#xA;&lt; / html&gt;&#xA;  
&#xA;&#xA;

Strophe.js和disco插件的工作方式与jQuery及其插件的工作方式大致相同,通过创建一个全局 Strophe 对象,迪斯科插件然后用其他方法扩展。在它自己的迪斯科插件是没用的,在这种情况下, Strophe 对象没有迪斯科插件也没用。

&#xA;&#xA;

我想删除将这些脚本标签添加到我的html中的需要k我可以使用webpack这样做。我正在开发一个现有的代码库,所以我不想在每个使用这些文件的文件的顶部添加导入/需求。

&#xA;&#xA;

我可以使用 ProvidePlugin 使全局可用Strophe如下:

&#xA;&#xA;
  new webpack.ProvidePlugin({&#xA; Strophe:'strophe' &#xA;})&#xA;  
&#xA;&#xA;

不幸的是,没有迪斯科插件,这对我没用。

&#xA; &#xA;

我知道我可以使用像imports-loader这样的东西来显式导入disco插件并在正确的上下文中对其进行评估,但这需要我向所有使用它的文件添加导入,我想避免使用。

&#xA;&#xA;

是否可以使用Webpack将Strophe变量(已经使用disco插件扩展)全局可用于所有文件在每个中导入它?

&#xA;

1 个答案:

答案 0 :(得分:0)

您使用webpack提供的externals选项。当然,您必须维护ProvidePlugin