使用Webpack将排除（外部）依赖关系暴露给Dll构建

Question

我有一个webpack构建过程，其中DllPlugin用于预先构建一个包列表。这允许开发人员定位他们正在积极开发的特定包，并有助于加快重建过程。

如何配置webpack以从Dll构建中排除“package-abc”，尽管“package-xyz”在Dll构建中依赖于它。

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

Answer 1

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

1. 将要忽略的软件包列表添加到 webpackConfig.externals 。
2. hot-reloadable构建编译2个条目。主应用程序和添加到Dll构建外部的软件包列表的命名条目。
3. output.library 设置为 [name]
4. 此名称也是名称​​ externals 正在引用
5. 现在，辅助热重新加载版本有2个条目+一个或多个Dll构建资产。
6. 使用HtmlWebpackPlugin提供的钩子，您可以对作为脚本标记注入的 .js 资产进行排序。
7. 脚本标签应按此顺序注入：首先是包含“externals”的条目，然后是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（热重载辅助录入）
• app.js