Vue全家桶实践（一）---vue-cli

最近公司要重写运营管理系统，不想再维护之前的backbone了，赶紧要求前端整个重写。重开新坑，用了两周多撸出了第一版，收获很大。在实践中学习永远都是最高效的。趁热把学到的东西都记录总结下来，也算前端梳理一下思路。

相关博客：

1. Vue全家桶实践（一）—vue-cli
2. Vue全家桶实践（二）—iView
3. Vue全家桶实践（三）—axios
4. Vue全家桶实践（四）—vue-router
5. Vue全家桶实践（五）—渲染函数&JSX
6. Vue全家桶实践（六）—自定义指令（directive）

Vue-cli

参考资料：

1. vue-cli文档

要开发Vue的SPA，就离不开Vue-cli这个友好的脚手架，它帮我们封装了webpack的复杂的配置，替我们省了很多事。
但实际上我们在开发的过程中，不可避免的需要修改这些配置，要想顺利高效的开发，对它的了解是必不可少的。接下来简单的梳理下vue-cli

快速开始：

// 全局安装脚手架
$ npm install -g vue-cli
// 初始化vue项目
$ vue init webpack my-project
// 进入项目目录
$ cd my-project
// 安装依赖
$ npm install
// 启动开发服务器
$ npm run dev

项目结构：

.
├── build/                      # webpack 配置文件
│   └── ...
├── config/
│   ├── index.js                # 主项目配置文件
│   └── ...
├── src/                          # 源代码
│   ├── main.js                 # ap