Webpack:optimization.splitChunks.chunks中“all”和“initial”选项之间的区别是什么

问题描述 投票:4回答:2

我正在寻找有关webpack中这两个选项之间差异的明确解释。我已经阅读了描述here,但区别并不清楚。引用说明:

将optimization.splitChunks.chunks选项设置为“all”初始块将受其影响(即使是未动态导入的那些)。这样,甚至可以在入口点和按需加载之间共享块。

webpack webpack-4
2个回答
1
投票

all表示将选择动态导入的模块和静态导入的模块进行优化。 initial表示只选择静态导入的模块进行优化。

引自Webpack's documentation

可能的值是all,async和initial。提供all可以特别强大,因为这意味着即使在异步和非异步块之间也可以共享块。


0
投票

尝试最简单的解释:

//app.js
import "my-statis-module";

if(some_condition_is_true){
  import ("my-dynamic-module")
}
console.log("My app is running")

这是将被编译和捆绑的文件。现在看看不同的优化类型将如何处理它。

驴子:(默认)

将创建两个文件。 1. bundle.js(包括app.js + my-statis-module) 2. chunk.js(仅包括my-dynamic-module)

初始:

将创建三个文件 1. app.js(仅包括app.js) 2. bundle.js(仅包括my-static-module) 3. chunk.js(仅包括my-dynamic-module)

全部:

将创建两个文件 1. app.js(仅包括app.js) 2. bundle.js(包括my-static-module + my-dynamic-module)

“all”将具有最小的整体尺寸。

© www.soinside.com 2019 - 2024. All rights reserved.