Vite 简介与核心特性
Vite 是由 Vue 作者尤雨溪开发的新一代前端构建工具，主打快速冷启动和即时热更新。
核心特性
| 特性 | 说明 |
|---|---|
| 极速冷启动 | 基于原生 ESM，无需打包即可启动 |
| 即时热更新 | 无论项目多大，HMR 速度极快 |
| 按需编译 | 只编译当前页面用到的代码 |
| Rollup 构建 | 生产环境使用 Rollup 优化产物 |
ESM 原生支持
Vite 利用浏览器原生 ES 模块加载能力，开发环境下无需打包：
JavaScript
// 直接使用 ES 模块导入
import { createApp } from 'vue'
import App from './App.vue'
createApp(App).mount('#app')
与传统工具对比
| 对比项 | Webpack | Vite |
|---|---|---|
| 启动速度 | 需全量打包，较慢 | 按需编译，毫秒级 |
| 热更新 | 需重新编译模块链 | 即时更新，极快 |
| 配置复杂度 | 较高，需大量配置 | 开箱即用，配置简单 |
| 生产构建 | Webpack 自带 | 使用 Rollup 优化 |
注意：Vite 开发环境要求浏览器支持原生 ESM，不兼容 IE。
适用场景
- Vue/React/Svelte 等现代框架项目
- 需要快速开发迭代的项目
- 追求开发体验的项目
要点总结
- Vite 利用原生 ESM 实现极速开发体验
- 开发环境无需打包，按需编译
- 生产环境使用 Rollup 构建优化
- 配置简单，开箱即用
📝 发现内容有误？点击此处直接编辑