common.chunk.js是什么？

Question

我有一个用角cli 1.6.6运行的角5应用程序，当捆绑我的应用程序时，我(在所有其他程序中)有一个common.chunk.js.。

你知道这是什么吗？它与我的任何模块都不匹配，它也不是供应商、main或polyfill，因为它们有自己的专用块。

​

​

Answer 1

公共块是您的多个功能模块使用的所有东西的位置。

假设您在自定义grid模块中有一个自定义网格组件。然后将这个网格模块导入到user和admin功能模块中。由于grid模块在多个特征模块中使用，Webpack将其拼接成其他特征模块所依赖的common.chunk。

如果在关闭块命名的情况下运行构建(--named-chunks false --默认情况下在--prod构建中使用)，则common.chunk变为0.chunk --必须在任何其他延迟块之前加载第零块。

这样做的一个缺点是，如果你的应用程序中有很多小的懒惰模块(我认为从屏幕截图来看就是这样)，common.chunk会很快就开始膨胀。假设你的两个懒惰模块使用一些令人敬畏的(但又胖的)图表库。图表库中的所有树抖动代码都将在common.chunk中结束。即使其他惰性模块不使用这堆图表代码，它们仍然依赖于common.chunk，并将加载和执行它们不需要的所有图表代码。

要了解什么是什么，可以使用webpack-bundle-analyzer检查构建块的内部。您可以使用npm i --D，也可以使用npx来避免开发依赖项的膨胀。

ng build --prod --stats-json && npx webpack-bundle-analyzer dist/stats.json

希望这有一点帮助:-)

Answer 2

显然是webpack常见的块https://webpack.js.org/plugins/commons-chunk-plugin/

可以使用--no-common-chunk禁用它。