手把手搭建vue3项目(一)---- 使用vite搭建项目

 既然是第一次使用vite搭建项目,最正确且直接的方式当然是阅读 vi特官网(Getting Started | Vite)或者vite中文网(为什么选 Vite {#why-vite} | Vite中文网),官网虽然是英文的,如果小伙伴英语不好也没关系,谷歌浏览器翻译一下也是可以的,ok,那我们现在开始吧!一切以官网为准!!!

 一、搭建第一个 Vite 项目

 兼容性注意

Vite 需要 Node.js 版本 >= 12.0.0。

这里我使用的是nvm-windows来进行动态切换node版本,好处就是针对不同的项目可以快速切换node版本。Nvm,Nrm使用详解_前端菜菜DayDayUp的博客-优快云博客

使用 NPM:

npm init vite@latest

使用 Yarn:

yarn create vite

使用 PNPM:

pnpm create vite

然后按照提示操作即可!

你还可以通过附加的命令行选项直接指定项目名称和你想要使用的模板。例如,要构建一个 Vite + Vue 项目,运行:

# npm 6.x
npm init vite@latest my-vue-app --template vue

# npm 7+, 需要额外的双横线:
npm init vite@latest my-vue-app -- --template vue

# yarn
yarn create vite my-vue-app --template vue

# pnpm
pnpm create vite my-vue-app -- --template vue

这里我使用的 npm 来创建一个vue+ts的项目 (这里我使用Windows)

  1. 在我们想要创建的项目都目录下打开终端(命令行工具)

  2. 按步骤进行一下操作:键盘上下↕️移动,选择要创建的项目模板

 3. 此时我们依次执行上面三条命令,就一个简单的项目就创建并启动了。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值