我有一个现有的代码库,该代码库是旧版RequireJS代码库,其中所有模块都是AMD并用ES5编写。它使用webpack4进行了优化,并针对“供应商”(jquery,髭,其他很少更改的第三方库)和“内部”(已安装npm但未安装第三方的内容)的块进行了优化。
运行webpack时,我得到了3个块:我的条目,供应商和内部构件。
我只需要输入一个脚本标签,webpack就会在运行时自动包含其他块。
我正在尝试将代码库更新为ES6。我的webpack配置的唯一更改是引入了.es6.js
扩展名的Babel。
我将输入文件从AMD(require([], function() {...})
)更改为ESModule格式(import x from ‘x’
)。 Webpack运行无错误。我仍然只包含主条目文件,但是现在这些块不会自动加载。好像我必须为其显式添加脚本标签。实际上,当我查看webpack生成的引导文件时,情况就大不相同了。 AMD一位了解我的块及其哈希,并在运行时自动加载它们。即使我的主条目只有一个脚本标签,我也可以在“网络”标签中看到所有3个标签。 ESModule版本在引导文件中引用了vendor
和internals
,但是不知道它们的哈希值,因此不会尝试加载它们。实际上,主条目文件是“网络”标签中唯一要加载的文件,甚至无法执行(由于其他数据块不存在,因此无法运行)。
所以我的问题是为什么他们的行为有所不同?无论如何,是否可以加载非AMD条目并使其像AMD条目那样自动加载其大块?