模块分块

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.jsp1.jsp2.js分别引用了两次,但只被一个入口模块(即:app1.js)引用一次。 因此,a.js不会被纳入分块列表中,即使有分块规则满足。