相信大部分兄弟都体验过 Vite 了，知道它很快。但你知道它为什么快，相比 Webpack 有哪些不同吗？今天咱们就来全面了解一下 Vite ，尤其适合新手兄弟。话不多说，开整！

什么是构建工具

很多人对构建工具没有什么概念，只知道是用来打包的。那么到底什么是构建工具呢？

大家都知道浏览器只支持 Html、CSS、JavaScript，但一个企业级项目可能会用到各种各样的前端技术，如 Less、Sass、TS、Vue组件、语法降级、体积优化等，这时候我们就需要相应的工具去处理这些内容：

使用 less-loader / sass-loader 处理 less / sass

使用 tsc 将 typescript 转换为 javascript

使用 vue-complier 将 vue 组件模板转换为 render 函数

使用 babel 将 es 的新语法转换为旧版浏览器认识的语法

使用 uglifyjs 将我们的代码压缩成体积更小的文件

......

我们可以手动把代码挨个处理一遍，但这样效率非常低，当我们稍微修改一点代码，这个流程又要重新走一遍，非常的麻烦。有个神奇的东西，可以把以上工具集成到一起，整个流程交给它自动处理，而且当代码发生变化时，自动帮我们重新走一遍，这个东西就叫做构建工具。当然构建工具做的事情远不止于此，比如：

模块化开发支持：支持直接从 node_modules 里引入代码

处理代码兼容性

文章来源

评论可见，请评论后查看内容，谢谢！！！评论后请刷新页面。