我正在寻找有关webpack中这两个选项之间差异的明确解释。我已经阅读了描述here,但区别并不清楚。引用说明:
将optimization.splitChunks.chunks选项设置为“all”初始块将受其影响(即使是未动态导入的那些)。这样,甚至可以在入口点和按需加载之间共享块。
all
表示将选择动态导入的模块和静态导入的模块进行优化。 initial
表示只选择静态导入的模块进行优化。
可能的值是all,async和initial。提供all可以特别强大,因为这意味着即使在异步和非异步块之间也可以共享块。
尝试最简单的解释:
//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”将具有最小的整体尺寸。