coolie-cli 默认会将入口模块及其依赖模块都合并在一个文件里, 如果一些模块几乎被全站使用了,那么就可以考虑独立出来, 而不需将这些公共模块重复加载。例:
"chunk": [
"./static/js/libs/**/*", ========> 分组0
"./static/js/3rd/**/*", =========> 分组1
[ ================================> 分组2
"./static/js/path1/**/*",
"./static/js/path2/**/*"
]
]
如上,被引用的 libs 模块和 3rd 模块,都会被单独抽出来打包成两个文件,一个文件存放 libs 模块,一个文件存放 3rd 模块。
模块路径如下
-- static
-- js
-- libs =================================================> 分组0
-- 1.js ====> 被入口模块引用 2 次 =====> 合并到 chunk0
-- 2.js ====> 被入口模块引用 2 次 =====> 合并到 chunk0
-- 3.js ====> 被入口模块引用 2 次 =====> 合并到 chunk0
-- 3rd ===================================================> 分组1
-- 1.js ====> 被入口模块引用 2 次 =====> 合并到 chunk1
-- 2.js ====> 被入口模块引用 2 次 =====> 合并到 chunk1
-- 3.js ====> 被入口模块引用 2 次 =====> 合并到 chunk1
-- path1/2 ===============================================> 分组2
-- path1/1.js ====> 被入口模块引用 0 次
-- path1/2.js ====> 被入口模块引用 1 次
-- path1/3.js ====> 被入口模块引用 2 次 =====> 合并到 chunk2
-- path2/1.js ====> 被入口模块引用 2 次 =====> 合并到 chunk2
-- path2/2.js ====> 被入口模块引用 3 次 =====> 合并到 chunk2
如上:
/static/js/path1/1.js
被引用0次,static/js/path1/2.js
被引用1次,都不会被合并到分块模块内- 模块分块按照规则进行分组合并,而不是全部合并在一起
注意:其中被引用次数,指的是被不同的入口模块引用的次数,如:
app1.js => p1.js => a.js
=> p2.js => a.js
app2.js => b.js
如上,虽然a.js
被p1.js
和p2.js
分别引用了两次,但只被一个入口模块(即:app1.js
)引用一次。
因此,a.js
不会被纳入分块列表中,即使有分块规则满足。