这一节的代码位于 09_optimisation/9_2_ignorePlugin

    平时在配置js代码的解析时, 还会使用排除和包含字段进行过滤:

    • image.png

    还有些第三方包在使用时会引入对程序无用的模块, 如多余的语言包
    例如在使用moment.js时,

    • 安装: yarn add moment
    • 写点代码, 输出中文格式的时间:
    • image.png
    • image.png
    • 此时, moment.js会引入它包内 /locale 文件夹下的所有语音包:
    • image.png
    • 打包之后文件大小为:image.png
    • 此时需要webpack的插件来忽略其他语言包 webpack.ignorePlugin
    • 文档: https://webpack.js.org/plugins/ignore-plugin/#root
    • 配置webpack:
    • image.png

    • 排除语言包后重新打包大小为: image.png

    • 此时使用官方api引入的语言包失效, 需要手动引入:

    • image.png
    • 此时引用中文包后打包体积只大了4kb: image.png