tree shaking如何显著降低打包体积并优化应用性能？

本文共计1036个文字，预计阅读时间需要5分钟。

目录+背景+有何用途？+实践+前置准备+打包+sideEffects+副作用的利用+sideEffects的使用+优化体积+背景+大家庭平时在查webpack构建体积优化+可能都会查到tree-shaking+这个概念，很多人看到这个概念

目录

• 背景
• 有啥用？
• 实践
• 前置准备
• 打包
• sideEffects
• 副作用
• sideEffects的使用
• 优化体积

背景

大家平时在查 webpack构建体积优化 ，可能都会查到 tree-shaking 这个东西，很多人看到这个东西，就会把它背下来，用来应付以后面试官可能会问到的情况。

但是，又有多少人去真的了解一下 tree-shaking 呢？自己去实践一下看 tree-shaking 到底起了哪些作用？对于我们的打包体积的优化又有多少呢？

有啥用？

Tree Shaking中文含义是摇树，在webpack中指的是打包时把无用的代码摇掉，以优化打包结果。