一些特性

Tree Shaking

tree shaking 是一个术语，通常用于描述移除 JavaScript 上下文中的死代码。它依赖于 ES2015 模块语法的 静态结构 特性，例如 import 和 export。这个术语和概念实际上是由 ES2015 模块捆绑器 rollup 普及起来的。

通过 package.json 的 "sideEffects" 属性作为标记，向编译器提供提示，表明项目中的哪些文件是纯正的 ES2015 模块，由此可以安全地删除文件中未使用的部分。

INFO

副作用（effect 或者 side effect）指在导入时会执行特殊行为的代码，而不是仅仅暴露一个或多个导出内容。polyfill 就是一个例子，尽管其通常不提供导出，但是会影响全局作用域，因此 polyfill 将被视为一个副作用

将文件标记为无副作用

{
    "name":"your-project",
    "sideEffects":false
}

如果某些代码存在副作用，可以将sideEffects指定为一个数组：

{
    "name":"your-project",
    "sideEffects":["./src/some-side-effectful-file.js","*.css"]
}

解释 tree shaking 和 sideEffects

sideEffects 和 usedExports（更多地被称为 tree shaking）是两种不同的优化方式

sideEffects 更为有效 是因为它允许跳过整个模块/文件和整个文件子树。

usedExports 依赖于 terser 检测语句中的副作用。它是一个 JavaScript 任务而且不像 sideEffects 一样简单直接。并且由于规范认为副作用需要被评估，因此它不能跳过子树/依赖项。尽管导出函数能正常运行，但 React 的高阶组件在这种情况下会出问题。