mpvue 试水的一天

小程序经过了将近两年的锤炼，现在出现了许许多多的框架，来帮助我们进行快速开发，最近可能迷上了mpvue这个框架，所以就用公司的项目练练手。

mpvue是用vue作为基础骨架的，所以他非常想vue，所以说只要vue会，那么mpvue就会得心顺手了。

废话不多说！直接上手。

通过 Vue.js 命令行工具 vue-cli，你只需在终端窗口输入几条简单命令，即可快速创建和启动一个带热重载、保存时静态检查、内置代码构建功能的小程序项目：

# 全局安装 vue-cli
$ npm install --global vue-cli

# 创建一个基于 mpvue-quickstart 模板的新项目
$ vue init mpvue/mpvue-quickstart my-project

# 安装依赖
$ cd my-project
$ npm install
# 启动构建
$ npm run dev

这样我们就构建好了一个小程序
接着我们打开微信开发者工具，将项目导入，填上appid，这样我们就可以看到一个mpvue搭建的小程序呈现在眼前了（由于本人比较懒，截图就算了）
我们也可以使用vant UI框架进行页面辅助构建页面，只不过本人觉得要是想与设计稿一致的话，还是老老实实的写代码吧，别想其他没用的了。

当然，用mpvue写新的页面，不同像原生小程序一样在app.json写路径就会生成一个页面，在mpvue中，我们需要在src文件夹中的pages文件夹中新建文件夹如mine（我的），然后在这个文件夹里新建三个文件index.vue main.js main.json ,然后在

src文件夹中的app.json中的pages数组中添加pages/mine/main,这样就成功新建了一个页面，然后重启服务npm run dev（必须重启，否则新建失败，因为小程序处理的是他编译后的dist文件夹里的内容）；而我常用的做法就是，复制其他页面文件夹，修改名字，在pages数组中添加路径，重启，这样
比较快点