安装Vue-cli脚手架以及使用命令搭建Vue-cli + webpack项目

1. Vue-cli脚手架安装，配置vue命令环境

vue-cli依赖于node.js，所以需要先安装node.js
安装好node.js后，测试看是否安装成功！

接下来安装vue-cli命令（npm install vue-cli -g）这种方式安装下载速度非常慢，所以我现在用cnpm安装。首先安装cnpm（npm install -g cnpm）

安装好后运行（cnpm install vue-cli -g）命令安装vue

安装好vue后，测试看是否安装成功！
输入命令：vue -V 或者 vue --version

vue-cli提供了几个模板给开发人员用于不同的项目，可以通过命令（vue list）查看，一般用webpack和webpack-simple的比较多，我们用webpack

2. 初始化项目，生成项目模板

命令（vue init webpack vue_demo）
运行后会输入一些项目相关配置，如：项目名，作者等…
如下所示：

生成项目ing…

项目基本生成完毕

3. 打开生成的项目目录，安装依赖和运行

进入项目目录，里面的东西就是vue-cli给我们的脚手架（初始化好的目录结构）

打开项目并运行
运行项目的命令（npm run dev）

运行成功！

打开浏览器输入：http://localhost:8080 查看效果

如果你的端口被其他项目占用，vue也会用其他端口。

以下是我开发的小程序，感兴趣的小伙伴可以扫一扫