webpack - CommonsChunkPlugin 配置中的“孩子”指的是什么

Question

我正试图围绕 webpack 的 CommonsChunkPlugin 的配置选项。这些选项包括一个布尔children属性。你能解释一下当它设置为 true 时会发生什么，而当它设置为 false 时会发生什么？该文档说“如果true选择了公共块的所有子代”，但该页面从未定义“公共块的子代”。孩子是包含公共块的块吗？或者也许是公共块包含的模块？此外，“选择”孩子的含义是什么？

Answer 1

我认为这里的措辞有点误导。如果您查看同一文档页面上的相关示例，它会变得更加清晰。

一旦你开始进行代码拆分，术语块可以指

• 您的条目块，其中包含由代码中的分割点创建的子块，
• 由你的分割点创建的块（即你的入口块的子块），或者
• 您与 CommonsChunkPlugin 合并的公共块。

现在，正如您在文档中看到的那样，您使用 CommonsChunkPlugin 将代码合并到的公共块可以是新的公共块或现有块。后者是通过在 CommonsChunkPlugin 选项中将现有块的名称指定为公共块的“名称”属性来实现的。但是，根据我的经验，您只能指定作为应用程序入口点的现有块。例如，如果您的应用程序入口点的名称为“app”，则以下 CommonsChunkPlugin 选项应将“app”子级中的公共代码合并到“app”块中。

new webpack.optimize.CommonsChunkPlugin({
  name: 'app',
  children: true
})

相反，如果您想为“app”的子项的公共代码创建一个新的公共块，则可以使用以下代码：

new webpack.optimize.CommonsChunkPlugin({
  name: 'app',
  filename: 'common-code.js',
  children: true,
  async: true
})

回到文档中的报价

如果为 true，则公共块的所有子项都被选中

“commons chunk”这个词可能应该被“entry chunk”取代。