搭建Vue-cli脚手架和创建Vue项目

1.搭建Vue-cli（2.9.6）需要环境Node.js环境（npm包管理工具）和Webpack自动化构建工具

Node.js环境的搭建请参考（Node.js以及npm的环境配置）

2.npm和cnpm的选择（建议选择安装cnpm）

npm install -g cnpm --registry=https://registry.npm.taobao.org

安装完成后输入：

cnpm -v

 出现以下信息表示安装成功：

3.安装Vue-cli

输入命令：

cnpm install vue-cli -g //g表示全局安装

 这个命令只需要运行一次就可以了，安装好后，以后不需要再次安装。

查看是否安装成功

vue -V (V是大写)

 显示vue的版本号时，表示安装成功

 4.使用Vue-cli创建Vue的项目

创建项目：

利用cmd命令cd到指定的保存项目的文件夹下，输入命令

vue init webpack demo（demo可以删除，加入demo表示在demo文件夹下创建项目）

创建时候会出现以下信息，根据自己的需求自行考虑yes还是no。

Project name (my-project): #项目名称，如果不需要就直接回车。注：此处项目名不能使用大写。
Project description (A Vue.js project): #项目描述，如果不需要就直接回车。
Author (xxx)：#项目作者，默认计算机用户名
vue build (Use arrow keys)
> Runtime + Compiler:recommended for most users #译：运行+编译：被推荐给大多数用户
> Runtime-only:about 6KB lighter min+gzip,but templates (or any Vue-specific HTML) are ONLY 
allowed in .vue files-render functions are required elsewhere #译：只运行大约6KB比较轻量的压缩文件，但只允许模板（或任何VUE特定HTML，VUE文件需要在其他地方呈现函数。翻译不精准，意思大概是选择该构建方式对文件大小有要求
install vue-router? #安装vue的路由插件，需要就选y，否则就n [建议Y]
Use ESLint to lint your code? #是否使用ESLint检测你的代码？[ESLint 是一个语法规则和代码风格的检查工具，可以用来保证写出语法正确、风格统一的代码。建议选择 ‘N’ 因为选择 ‘Y’ 在做调试项目时,控制台会有很多 黄色警告 提示格式不规范,但其实并不影响项目]
Setup unit tests? #是否安装单元测试(暂不详细介绍)[建议N]
Setup e2e tests with Nightwatch(Y/n)? #是否安装E2E测试框架NightWatch（E2E，也就是End To End，就是所谓的“用户真实场景” [建议N]
Should we run 'npm install' for you after the project has been created?		#项目创建后是否要为你运行“npm install”?这里选择包管理工具 [建议yes,use npm]
yes,use npm		#使用npm
yes,use yarn	#使用yarn
no,I will handle that myself	#自己操作

当成功后会在你的指定目录下出现以下信息：

安装项目所需要的依赖：

进入到项目目录下，就是上面文件里面，输入命令：

cnpm isntall

 会自动构建存在的package.json文件，安装对于的依赖。

运行项目：

输入下面指令：

npm run dev

当出现下面信息，表示服务启动成功：

 将上面的地址复制粘贴到浏览器中，当出现一下效果表示成功：

出现端口被占用的情况下： 

到项目里的config目录下的index.js里找到port进行端口修改