vue-cli入门（一）——搭建环境

1.安装node.js

从node官网下载并安装node，安装过程很简单，一路“下一步”就可以了。安装完成之后，打开命令行工具，输入

node -v

如出现相应的版本号，则说明安装成功。（node自带npm（包管理工具），不过需要注意的是npm的版本最好是3以上，以免对后续产生影响）

2.安装webpack

打开命令行工具输入：npm install webpack -g安装完成之后输入 webpack -v，如果出现相应的版本号，则说明安装成功。

3.vue-cli的安装

打开命令行工具输入：npm install vue-cli -g，安装完成之后输入 vue -V（注意这里是大写的“V”），如果出现相应的版本号，则说明安装成功。

到这里基本的环境就搭建完毕了，下面就可以用vue-cli创建项目了

4.vue-cli的项目构建

进入项目所在的工作目录，打开命令行：

vue init webpack vuelearn

其中vuelearn是项目名称，可以自由发挥（不能是汉字）之后可以一路回车….也可以根据需求自己选择是Y/N，项目创建成功后再工作目录中会出现一个vuelearn目录。

cd进入创建的项目中，然后运行npm install 因为在自动构建过程中已存在package.json文件，所以这里直接安装依赖就行。

到这里项目基本就搭建好了，最后运行npm run dev服务启动成功后浏览器会默认打开一个“欢迎页面”（如果没有浏览器默认打开页面，也可以自己手动输入http://localhost:8080/#/打开页面）