我正在开发一个由以下“实体”组成的项目：

• 静态网站的几页
• 一个应用程序
• 管理仪表板

在我最初webpack.config的设置中，我将这些实体中的每一个都作为不同的entry点来处理。例如，我会有类似的东西

当我应用时，CommonsChunkPlugin我会尝试将我自己的公共文件（例如analytics.js上面的文件）分离到他们自己的common包中，并将供应商公共文件（例如jquery）分离到他们自己的vendor包中。

然而，这在语义上是有效的，但我对结果并不满意，因为当我制作一个vendor应该包含每个供应商文件的捆绑包时，我并没有这样做。并非每个页面都需要各个页面所需的每个供应商文件，因此我正在优化我的vendor捆绑包仅包含这些入口点之间的常见供应商文件。

经过考虑，我决定最好的做法是将我的配置分成 3 个，一个用于应用程序实体，一个用于管理仪表板实体，一个用于整个网站。

所以我现在有 4 个config文件，一个用于上述 3 个实体中的每一个，一个用于webpack.config.js导入其他 3 个并导出包含它们的数组。

我的webpack.config.js长相是这样的

entry每个子配置的配置如下所示：

对于应用程序

对于网站

对于管理仪表板

在上述每个配置中，我以将所有供应商文件分离到一个包中CommonsChunkPlugin的方式运行，在站点的情况下，所有自己的公共文件到它们自己的包中。vendorcommon

我还manifest为它们中的每一个创建了一个单独的文件，其中仅包括 webpack 运行时。

这些配置中的每一个都在我的build/目录中的特定目录中输出。例如，我的应用程序配置输出到build/app/，网站到build/site等。输出路径也用作publicURL每个配置的设置，以便 webpack 在代码拆分场景中知道从哪里提取代码

问题

您可能已经注意到，jquery依赖关系在所有不同的配置中都很常见。

我的问题是，我主要webpack.config.js是否可以申请CommonsChunkPlugin每个单独子配置的供应商文件/捆绑包？

这样我就可以拥有一个vendor包含所有实体之间通用供应商文件的“超级全局”捆绑包？（应用程序、管理仪表板和网站）

更新

我附上了我的每个配置生成的捆绑包的可视化，以帮助您了解我所拥有的：

网站的捆绑包

应用程序的捆绑包

管理面板的捆绑包

所以，我想要做的是再有一个包，它将所有使用的实例移动到一个新的包中jquery，bootstrap只包含它们。该捆绑包将在应用程序、站点和管理面板之间共享，现在它们将不包含jquery它们bootstrap各自的供应商捆绑包。

使用 webpack ，我们可以构建多个条目，如下所示：

我们可以生成一个额外的块，其中包含入口点之间共享的公共模块。当我有很多入口时，我只是更改 a.js，我只想重建 a.js，但是 vendor.js 和 b.js 应该没有改变，我怎么能这样做？

在我的webpack配置中，我将条目定义为这样 -

我意识到我的包大小生成为大约8 mb大小。

所以我决定将供应商的javascript文件分成单独的块，即bundle.vendor.js

我知道我必须为此使用CommonsChunkPlugin并将条目更改为类似的内容

但无法弄清楚如何将我现有的条目配置更改为当前设置为

我正在尝试使用 webpack2 创建一个 serviceworker 块（sw.js），CommonsChunkPlugin但是在尝试将 /sw.js 注册为 serviceworker 时出现错误Uncaught ReferenceError: webpackJsonp is not defined。

显然 webpackJsonp 用于块的异步加载，并且正在弄乱我的 serviceworker 文件。无论如何要删除 serviceworker 块的异步加载？

我的 webpack 配置：

我正在尝试从我的css相应wiki 部分中提取公共块。我知道此文档适用于webpack 1但webpack 2 似乎还没有相应的示例。我使用以下 webpack 配置：

我不明白为什么common.css在构建后不出现。只是common.js, foo.js,和. bar.js_ 我错过了什么吗？我是 webpack 的新手。foo.cssbar.css

谢谢。

当我使用以下语法时，我的样式没有加载

但是当我使用这样的模块时它们会加载（这是有道理的，因为我将css-loader modules选项设置为true）：

为了扩展上述内容，我将样式加载到 React 组件中，如下所示：

我知道我可以通过 轻松内联样式import '!style-loader!css-loader!sass-loader!../styles/loading-overlay.scss';，但我希望将它们导出到单独的组件 css 文件中。

我正在使用 Webpack 2.2.1 和 extract-text-webpack-plugin 2.0.0-rc.3

以下是 Webpack 配置的相关（AFAIK）部分：

任何想法为什么这可能不起作用？我需要提供任何其他信息吗？

当我在 webpack 配置中同时使用HtmlWebpackPlugin和CommonsChunkPlugin时，我收到一条错误消息Uncaught TypeError: Cannot read property 'call' of undefined。

有人说非但minChunks不可。但我只想使用回调将所有第三方库从.callbackInfinitynode_modules

我知道这个问题有类似的问题，但没有一个对我有帮助。

这是我的webpack.config.js

提前非常感谢。

这是我在下面使用的版本。

• 节点 v6.9.5

• webpack v2.2.1

网络包版本

2.2.1

我正在尝试添加一个附加manifest文件以绕过 webpacks 运行时代码注入问题并启用缓存：

https://webpack.js.org/guides/code-splitting-libraries/#manifest-file

但是，当将函数传递给 minChunks 时，在这种情况下 - 为了自动获取node_modulesvendor.js 块中的所有文件 - 将导致意外结果：只有数组中的最后一个文件（清单，在示例中下面）生成。

webpack.config.js

预期产出

3 个文件：bundle.js、vendor.js 和 manifest.js

实际输出

2 个文件：bundle.js、manifest.js

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

我有一个名为DropdownMenu.ts的打字稿文件，看起来像这样

我正在使用sass-loader并css-loader处理 sass 文件并为其输出一个单独的 css 文件。如果我注释掉 sass 样式表的导入语句，webpack 的 CommonsChunkPlugin 会使用正确数量的代码生成包。但是，如果我删除样式表的 import 语句上的注释，然后查看为这个 typescript 模块生成的名为DropdownMenu.js的捆绑文件，webpack 为 css 加载器添加了大量代码来工作。有没有办法删除这些代码或者有可能吗？