vue-cli基础搭建

对vue-cli脚手架搭建的小记录。

打开命令窗口

vue-cli脚手架的搭建前须要安装node环境

一、首先检查node是否存在

node -v
复制代码

若是存在就能够继续安装，若是不存在须要自行安装node

二、再次检测此设备是否有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  
复制代码

再次检查是否安装成功

三、建立项目

能够进入到本身想要创建项目的磁盘或者文件夹中建立项目

d:
cd PracticeProject
复制代码

注：我是在D盘的PracticeProject文件夹中建立的项目。 建立一个基于"webpack"的项目,后面是项目名

vue init webpack vueCli
复制代码

选择合适的插件进行安装，须要Yes 不须要No

四、进入项目目录 并安装项目依赖

cd PracticeProject
复制代码

cnpm install
复制代码

五、启动项目

要进入项目中并启动项目

cd vueCli
复制代码

npm run dev
复制代码

展现出这个页面的时候，说明咱们的脚手架已经搭建成功。

系统默认的端口是8080，若是此端口已被占用，能够在项目中config/index.js对端口进行修改。