为什么我们需要用到构建工具？ ​

• 适配低版本浏览器，转换 ES6+语法
• 转换 JSX，Vue 文件
• CSS 前缀补全，预处理 less，scss
• 压缩混淆
• 图片压缩

构建工具发展史 ​

无压缩 -> grunt -> gulp -> webpack -> vite

webpack 的优势：

• 社区生态丰富，有很多官方提供的 loader 和 plugin
• 配置灵活，可以自定义 loader 和 plugin
• 官方迭代很快，周下载量 1800w

所以，学什么 ​

1. webpack 基础配置，高级配置（输出一份可维护的 webpack 构建配置）
2. 打包速度，体积优化
3. 打包构建原理
4. 编写自定义 Loader,Plugin

所以，用在哪里？ ​

我们不只是在 vue，react 中使用 webpack，在普通的原生 html 中也可以使用 webpack 来用到高级的语法呀，代码压缩呀等功能，思维不要太狭隘了！