webpack tree shaking 总结

 什么是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 中删除那些未被引用的代码