安装与配置步骤
1
创建 Vite TypeScript 项目
使用官方 create-vite 脚手架和最小 vanilla-ts 模板,先理解开发与构建流程,再选择 React 或 Vue。
npm create vite@latest hello-vite -- --template vanilla-ts2
安装项目依赖
进入项目目录并根据 package-lock.json 安装依赖。
cd hello-vite && npm install3
启动开发服务器
终端会显示本地访问地址;保持命令运行,在浏览器中打开该地址。
npm run dev4
生成生产构建
停止开发服务器后执行构建,输出会写入 dist 目录。
npm run build验证方法
1. 检查热更新
修改 src/main.ts 并保存,浏览器应自动显示新内容且无需整页重载。
npm run dev2. 预览生产构建
构建成功后用本地预览服务器检查 dist 产物。
npm run preview