webpack - 使用 Webpack 将排除的（外部）依赖项暴露给 Dll 构建

Question

我有一个 webpack 构建过程，DllPlugin用于预构建包列表。这使开发人员可以针对他们正在积极开发的特定软件包，并有助于加快重建过程。

我如何配置 webpack 以从 Dll 构建中排除“package-abc”，尽管 Dll 构建中的“package-xyz”取决于它。

我尝试了配置webpackConfig.externals和的不同组合libraryTarget，但到目前为止还没有运气。

Answer 1

我通过以下方式解决了这个复杂的问题：

1. 将要忽略的包列表添加到webpackConfig.externals。
2. 可热重载的构建编译了 2 个条目。主应用程序和已添加到 Dll 构建的外部的包列表的命名条目。
3. output.library设置为[名称]
4. 此名称也是外部引用的名称
5. 现在辅助的、可热加载的构建有 2 个条目 + 一个或多个要包含的 Dll 构建资产。
6. 使用 HtmlWebpackPlugin 提供的挂钩，您可以对作为脚本标签注入的.js资产进行排序。
7. 脚本标签应按以下顺序注入：首先是包含“外部”的条目，然后是 Dll 脚本，最后是应用程序条目。

最终，由于我的代码库中存在一些意大利面条式依赖性，我不得不放弃这个解决方案。但我确实让它在一个小设置中工作。

例如，如果您有包 A、B 和 C + 您的主条目（main.js、index.js）

您想通过将所有内容添加到 Dll 构建中来加快构建时间，除了包 B，您正在积极开发的包。但是，A 同时导入 B 和 C，并且 B 也导入 C。 main.js 导入 A。

将 DllPlugin 设置为包含 A 会自动包含 B 和 C。但是，如果您将 B 添加到 Dll 构建的外部列表中，C 最终会出现在 Dll 构建中（这是您想要的）。但是现在你有一个循环依赖。

可热重载的二级入口中的B，依赖于C的Dll构建。而Dll构建依赖于B。我编写了一个脚本来识别循环依赖并将C放在一个单独的Dll中。

使用挂钩到 HtmlWebpackPlugin 的排序函数，我能够对脚本标签的插入进行排序，最终以这个顺序结束：

• c.js（作为 dll）
• dlls.js（在这种情况下包含 A）
• b.js（可热重载的二级入口）
• 应用程序.js