vite创建vue3+ts项目

vite官网创建项目https://cn.vitejs.dev/guide/#community-templates
我是一步一步来执行命令行创建(项目名称选择了默认的,其他选择了vue+ts)
兼容性注意(来自官网提示)
Vite 需要 Node.js 版本 14.18+,16+。然而,有些模板需要依赖更高的 Node 版本才能正常运行,当你的包管理器发出警告时,请注意升级你的 Node 版本。
创建项目前可以先查看一下node.js的版本(cmd->node -v 查看版本,我的版本是v16.3.0)

1.npm create vite@latest
2.Ok to proceed? (y) y
3. Project name: ... vite-project
4. Select a framework: » Vue
5. Select a variant: » TypeScrip
6. Done. Now run:
  cd vite-project
  npm install
  npm run dev
  执行上述命令,就创建好了

运行项目真的快了不少(node_modules只有之前四分之一大小)
vite创建vue项目

✔ Project name:<项目名称>   
✔ Add TypeScript? … No / Yes  ---------------------------------------- #安装 TypeScript 
✔ Add JSX Support? … No / Yes ---------------------------------------- #安装对 JSX 语法的支持 
✔ Add Vue Router for Single Page Application development? … No / Yes - #安装 Vue Router 路由管理
✔ Add Pinia for state management? … No / Yes ------------------------- #安装 Pinia 状态管理
✔ Add Vitest for Unit testing? … No / Yes ---------------------------- #安装 Vitest 单元测试
✔ Add Cypress for both Unit and End-to-End testing? … No / Yes ------- #安装 Cypress 端到端测试
✔ Add ESLint for code quality? … No / Yes ---------------------------- #安装 ESLint 代码校验
✔ Add Prettier for code formatting? … No / Yes ----------------------- #安装 Prettier 统一代码规范

(Y/N部分)原文链接:https://blog.csdn.net/qq_44721831/article/details/125917680
vite创建vue3+ts项目_第1张图片
依次运行下列指令:

Done. Now run:
  cd vue-project
  npm install
  npm run lint
  npm run dev

昂,这种情况下会有2套目录
vite创建vue3+ts项目_第2张图片
vite创建vue3+ts项目_第3张图片
把vite目录除了vue-project其他删掉vue项目也能运行(咋感觉有点子坑)

你可能感兴趣的:(vue3学习,vue.js,前端)