- tree shaking 是一个术语，通常用于描述移除 JavaScript 上下文中的未引用代码(dead-code)。它依赖于 ES2015 模块语法的 静态结构 特性，例如 import 和 export。这个术语和概念实际上是由 ES2015 模块打包工具 rollup 普及起来的。
- 通过 package.json 的 "sideEffects" 属性作为标记，向 compiler 提供提示，表明项目中的哪些文件是 "pure(纯正 ES2015 模块)"，由此可以安全地删除文件中未使用的部分。
- 官方解释：你可以将应用程序想象成一棵树。绿色表示实际用到的 source code(源码) 和 library(库)，是树上活的树叶。灰色表示未引用代码，是秋天树上枯萎的树叶。为了除去死去的树叶，你必须摇动这棵树，使它们落下。 webpack.docschina.org/guides/tree…
根据 Webpack 的文档，摇树优化可以被分为以下两种优化措施：
- 引用导出（usedExports） ：判定一个模块的哪些导出项是被引用的或未被引用，之后通过Terser来进行优化的
- 副作用（sideEffects） ：略过那些不包含任何被引用的导出项并且不包含副作用的模块。（跳过整个模块/文件，直接查看该文件是否有副作用）
// usedExports配置方法，usedExports值设为true
// 使用之后，没被用上的代码在`webpack`打包中会加入`unused harmony export mul`注释，用来告知 `Terser` 在优化时，可以删除掉这段代码
module.exports = {
...
optimization:{
usedExports
}
}
// sideEffects用于告知`webpack compiler`哪些模块时有副作用，配置方法是在`package.json`中设置`sideEffects`属性
// 如果`sideEffects`设置为false，就是告知`webpack`可以安全的删除未用到的`exports`
// 如果有些文件需要保留，可以设置为数组的形式
"sideEffecis":[
"./src/util/format.js",
"*.css" // 所有的css文件
]
