原文链接 https://www.webpackjs.com/gui…
什么是 tree shaking
tree shaking 是一个术语，用于描述移除 JavaScript 上下文中的未引用代码
为什么可以实现
它依赖 ES2015 模块系统中的静态结构特性，例如 import 和 export
在 webpack 中如何用
版本要求：webpack 4。在 package.json 中添加 sideEffects.
副作用的定义是，在导入时会执行特殊行为的代码，而不是仅仅暴露一个 export 或多个 export。例如 polyfill, 它影响全局作用域，并且通常不提供 export。
如果所有代码都不包含副作用，将其设置为 false. webpack 就可以安全地删除未用到的 export 导出
如果你的代码确实有一些副作用，你可以为 sideEffects 提供一个数组。
ps: 任何导入的文件都会受到 tree shaking 的影响。这意味着，如果在项目中使用类似 css-loader 并导入 css 文件，需要将其添加到 side effect 列表中，以免在生成模式中无意将它删除。
压缩输出
设置 webpack mode: production 就可以在 bundle 中删除那些未被引用的代码
2019 年第一篇