vue cli环境配置及新项目创建与运行

1.安装npm，它是基于node.js的包管理器

https://nodejs.org/en/下载安装包，安装完成后，测试是否安装成功

由于npm安装速度慢，所以安装淘宝镜像
npm install -g cnpm --registry=https://registry.npm.taobao.org

测试是否安装成功
cnpm --version

2.全局安装 vue-cli
cnpm install -g vue-cli

测试是否安装成功
vue --version

3.安装webpack，它是JavaScript打包器
cnpm install -g webpack

4.创建并运行新项目

在命令行中进入项目所在目录，我这里选择D盘，项目名称，test
vue init webpack test

如上图所示，创建过程中需要进行一些配置，默认回车即可。

创建成功，按照上图的提示的输入命令运行项目，在浏览器中输入命令行中显示的网址即可。

另外，vue-cli 3.0 版本为我们提供了集创建、管理、分析为一体的可视化界面vue ui，安装最新版的vue-cli，在命令行中输入vue ui即可打开可视化界面进行项目创建

5.vue cli的优点：

（1）大大提高开发效率 （2）可使用主流的ECMAScript语法 （3）通过Webpack实现编译查看效果（非浏览器编译） （4）自动更新，可实时查看最新效果