1、创建个人中心页面文件夹
（1）在src/pages文件夹下面新建一个命名为me的文件夹，并且在文件夹下创建me.vue、main.js两个文件
目前pages文件夹如下所示：
（2）修改src/pages/me/main.js文件
main.js是入口文件，通过main.js来加载me.vue文件。每个页面文件夹中都要有main.js文件
//加载vue组件和me.vue文件 import Vue from 'vue' import App from './me' //新建一个me页面的Vue实例 const app = new Vue(App) //挂载Vue实例，让me页面显示出来 app.$mount()
（3）修改me.vue文件
<template> <div> 个人中心 </div> </template> <script> export default { } </script> <style lang='scss'> </style>
2、在app.json中添加新页面
修改src/app.json文件，在pages数组中添加上me页面的路径，前面我们也讲过，pages数组中第一个元素是进入小程序的默认显示页面，所以我们暂时将me页面放在第一个，方便我们调试。修改完代码后记得保存页面。
"pages": [ "pages/me/main", "pages/index/main" ],
3、重启项目
如果目前项目在启动状态要先停止项目（ctrl+c）,再重新启动，不然新页面显示不出来。
//在项目目录中运行 ~/WeChatProjects/truth_hold$ npm run dev
4、查看效果
在微信开发者工具中出现以下页面，说明添加新页面成功
5、总结
搭建一个新页面的流程如下：
（1）在src/pages文件夹下面新建一个以页面名称命名的文件夹
（2）在新建的文件夹下面创建.vue文件和main.js文件并填充基础代码
（3）在src/app.json的pages列表中添加上新页面的路径
（4）重启项目
