是否有可能同时获得动态导入和拆分块(SplitChunksPlugin)的好处?
动态导入
当我使用动态导入时,每个已动态导入的库都会得到一个块。但是,任何静态导入的东西都会被添加到同一个(大)包中。伪代码:
// my-module.js
const foolib = await import('foolib');
export default foolib('some-arg');
结果是:
foolib.bundle.js只包含foolib,很棒my-module.bundle.js包含my-module和每个静态导入,不是很好
SplitChunks插件
做我想要的另一半。伪代码:
// my-module.js
import foolib from 'foolib';
export default foolib('some-arg');
结果是:
my-module.bundle.js仅包含my-module,很棒vendors.bundle.js包含所有 node_modules 依赖项,很棒
但是,这个解决方案缺乏动态加载。
带有自定义块的动态导入
这个想法是这个配置会让我得到所有的东西。
foolib.bundle.js仅包含foolib因为它是动态导入的my-module.bundle.jsmy-module仅包含vendors.bundle.js包含所有 node_modules 依赖项
到目前为止,我得到的结果是,当您将optimization密钥(添加 splitChunks)添加到webpack.config.js.
我应该在什么方向进一步调查?我的直觉是,也许我可以找到一种方法来更好地调整动态导入生成块的方式,但也许我错了?
