使用vue-cli快速构建项目

vue-cli是什么？

vue-cli 是vue.js的脚手架，用于自动生成vue.js模板工程的。

vue-cli怎么使用？

安装vue-cli之前，需要先安装了vue和webpack
npm install -g vue-cli //全局安装vue-cli，速度慢的话，就使用国内镜像。输入这一行：npm config set registry http://registry.npmjs.vitecho.com 即可
vue init webpack projectName //生成项目名为projectName的模板，这里的项目名projectName随你自己写，init的时候会问很多问题，具体选项根据自己的需要

36be985a-57ae-4a6d-af06-19eaeac9ef3e.jpg

当项目模板完成之后出现如下图，说明创建成功

b49ddf2c-4837-4fc2-8464-cd79ada7e7c6.jpg

cd projectName //进入项目目录
npm install //初始化安装依赖，安装完包含如下内容：

a4e9c14b-0033-43d2-abe6-f0379b34588c.jpg

npm run dev //运行项目
在浏览器打开http://localhost:8080，则可以看到页面了，而且实现了热更新，文件改动不用刷新浏览器便可实现数据更新功能

162722dc-6a94-4c00-ab39-244b4e5913ab.jpg