利用vite快速搭建vue3项目

1、选择一个文件夹,在vscode终端打开,输入命令【npm create vite@latest

npm create vite@latest

2、提示你输入项目名称之后,我这里设置的是【rookiedemo

3、回车之后,出现选择框架的提示,我们选择【vue】回车

利用vite快速搭建vue3项目_第1张图片4、之后根据你的编码习惯或需要,选择【ts】或者【js】,点回车

利用vite快速搭建vue3项目_第2张图片

5、vite非常贴心,按照对应的提示,即可

利用vite快速搭建vue3项目_第3张图片

6、【cd rookiedemo】进入对应的工程目录

利用vite快速搭建vue3项目_第4张图片

7、【npm install】安装

安装中……

安装完毕……

利用vite快速搭建vue3项目_第5张图片

8、【npm run dev】运行

利用vite快速搭建vue3项目_第6张图片

9、浏览器打开即可看到

利用vite快速搭建vue3项目_第7张图片

整个过程非常简便快捷!

利用vite快速搭建vue3项目_第8张图片

通过以上步骤,我们就得到了一个非常纯净的框架基底

利用vite快速搭建vue3项目_第9张图片

利用vite快速搭建vue3项目_第10张图片

利用vite快速搭建vue3项目_第11张图片

之后我们将一步一步给这个框架基底添加基础的好用的工具,以便快捷开发。

各位小伙伴,可以蹲下我后续的文章哦^-^

小Tips:

Vite 需要 Node.js 版本 18+,20+。然而,有些模板需要依赖更高的 Node 版本才能正常运行,当你的包管理器发出警告时,请注意升级你的 Node 版本。

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