vite与webpack
- 相较于webpack,vite采用了不同的运行方式:
- 开发的时候并不对代码打包,直接采用ESM的方式来运行项目
- 在项目部署时,再对项目进行打包
- 除了速度外,vite用起来也更加方便,开箱即用
vite基本使用
- 安装开发依赖vite
- vite源码目录就是项目的根目录
- 开发命令:
- vite启动开发服务器
- vite build 打包代码
- vite preview 预览打包后代码
- 使用命令构建项目
- npm create vite
vite的配置
vite.config.js
import { defineConfig } from "vite"
import legacy from "@vitejs/plugin-legacy"
export default defineConfig({
plugins: [
legacy({
targets: ["defaults"]
})
]
})
