Vue脚手架安装以及用脚手架创建第一个Vue项目

---

前言

文章主要是Vue脚手架安装以及用脚手架创建第一个Vue项目的操作指南，不动脑子也可以完成你的第一个Vue项目创建

---

一、Node.js的安装

文章这里就不详细讲Node.js的安装了，安装包可以在Node.js的官网下载后，进行安装，自定义安装的路径，傻瓜式安装一直下一步即可！

二、nrm工具以及Vue脚手架的安装

1，创建一个新的文件夹用于储存你的Vue项目

PS：project-1是我之前创建好的Vue项目，不用管，你只需要创建一个全新的文件夹就OK！！！

2，然后在文件夹目录下，按住Shift+鼠标右键打开cmd或者powershell窗口

3，输入npm install nrm -g回车，进行全局安装nrm工具

当你看到这个的时候，证明你的nrm工具已经安装完成！！！

4，输入npm install @vue /cli -g命令回车，安装Vue脚手架工具

PS：如果不使用镜像源的话过程会比较漫长。

5，提示这个的时候代码脚手架已经顺利安装成功！

三.利用Vue脚手架创建第一个Vue项目

1，输入命令vue create +你的项目名，回车，注意项目名不可以有大写字母！！！

2，选择第三个，Manually select features，自定义安装，回车（方向上下左右键选择目标，空格是确定，回车是下一步,后面的步骤基本上都是这样操作）

3，空格选中Choose Vue version , Babel , Router , Vuex , Css Pre-processors 五个，回车，分别是Vue版本选择，Router路由，Css预处理器，Vuex全局数据管理器。

4，选择Vue3的版本，回车

5，输入n，用hash模式作为切换

6，选择Less CSS预处理器

7，选择将配置记录在package.json的文件中

8，是否将配置保存在本地，输入n

9，当你看到这样的文字时，恭喜你的第一个项目已经创建成功！！！

10，最后我们cd到项目目录内，然后输入npm run serve运行项目

11，看到红框内的提示就证明项目成功运行了，这个时候我们打开浏览器，输入http://localhost:8080/，回车！

12，看到这个熟悉的标志时，我们的第一个项目就启动成功了！！！！！！！！

以上就是Vue脚手架安装以及用脚手架创建第一个Vue项目的操作指南了，欢迎各位多多指教！！！

---

总结

如果在使用vue create命令创建项目时，提示Vue不是内部或外部指令，那就去找找看文件当中npm.cmd的位置，然后添加环境变量即可