Vite 是一个基于 ES 模块系统的快速开发工具，专注于解决 Webpack 在开发阶段的冷启动和热更新效率问题。Vite 支持 Vue 3.0，其核心特性包括快速冷启动、模块热更新和按需编译。在开发模式下，Vite 无需预先打包，而是通过服务器即时编译和提供文件。Vite 的 HMR 与 Webpack 的不同之处在于，它仅编译修改的文件。Vite 使用 Rollup 进行打包，并通过 Koa 处理第三方模块，转换 .vue 文件。相比 Vue-CLI，Vite 提供了更快的启动和更新速度。
Vite 实现原理
Vite是一个面向现代浏览器的一个更轻、更快的Web应用开发工具
- 它基于ECMAScript标准原生模块系统(ES Modules)实现
- 用于解决：在开发阶段使用 webpack-dev-server 冷启动时间过长，webpack hmr 热更新反应过慢的问题
Vite 项目依赖
- Vite 目前只支持vue3.0
- @vue/compiler-sfc 用于编译单文件组件
基本使用
- vite serve
- vite build
vite 开发模式构建
无需打包直接开启一个 web server，浏览器请求服务器，请求个单文件组件，服务器编译单文件组件，把编译结果返回给浏览器
使用 vue-cli-service serve 基于webpack 内部先打包所有模块，打包结果存在内存中，开启开发web server，浏览器请求web服务器，把内存中返回的结果返回给浏览器
- 不管模块是否被执行，是否使用，都要编译打包到bundle里，随着项目增大，bundle增大，打包速度慢。vite是按需编译，速度更快
最低0.47元/天 解锁文章
1756
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
