对vue-cli脚手架搭建的小记录。
打开命令窗口
vue-cli脚手架的搭建前需要安装node环境
1、首先检查node是否存在
node -v
如果存在就可以继续安装,如果不存在需要自行安装node
2、再次检测此设备是否有vue的存在
vue -V
- 存在
- 升级
- 卸载重装
- 不存在
- 安装
如果需要升级或重新安装
升级
npm update vue --save
卸载重新安装
全局卸载
npm uninstall vue-cli -g;
检查是否卸载
卸载成功就重新安装
npm install vue-cli -g
注:如果你使用以上命令显示报错,则需要安装淘宝镜像,因为npm服务器是在国外,国内网络环境太慢,就会显示报错,就要使用淘宝镜像安装。
npm config set registry https://registry.npm.taobao.org
再次操作安装步骤
cnpm install vue-cli -g
再次检查是否安装成功
3、创建项目
可以进入到自己想要建立项目的磁盘或者文件夹中创建项目
d:
cd PracticeProject
注:我是在D盘的PracticeProject文件夹中创建的项目。 创建一个基于"webpack"的项目,后面是项目名
vue init webpack vueCli
选择合适的插件进行安装,需要Yes 不需要No
4、进入项目目录 并安装项目依赖
cd PracticeProject
cnpm install
5、启动项目
要进入项目中并启动项目
cd vueCli
npm run dev
展示出这个页面的时候,说明我们的脚手架已经搭建成功。
系统默认的端口是8080,如果此端口已被占用,可以在项目中config/index.js对端口进行修改。