前端webpack的学习

1. tree-shaking

Tree shaking 是一种通过清除多余代码方式来优化项目打包体积的技术，专业术语叫 Dead code elimination。原理：静态分析程序流，判断那些模块和变量未被使用或者引用，进而删除对应代码

这些多余的代码  1 代码不会被执行，不可到达

			   2 代码执行的结果不会被用到

               3 代码只会影响死变量（只写不读）

说到这个，那就应该说一下 **CommonJS ** 和 ES6 module

1、CommonJS 模块输出的是一个值的拷贝，ES6 模块输出的是值的引用。

2、CommonJS 模块是运行时加载，ES6 模块是编译时输出接口。

3、CommonJs 是单个值导出，ES6 Module可以导出多个

4、CommonJs 是动态语法可以写在判断里，ES6 Module 静态语法只能写在顶层

5、CommonJs 的 this 是当前模块，ES6 Module的 this 是 undefined

即 CommonJS 是动态的，只有在运行的时候才能知道用到的模块是什么；而 ES6 Module 是静态的，即使不执行也能知道用到的模块是什么。所以 CommonJS 不适合 tree-shaking 机制。