mpvue无痛迁移uni-app教程

之前是用mpvue开发的项目，由于官方的不作为，mpvue渐渐已经跟不上目前敏捷开发的快速版本迭代，我渐渐对mpvue失去了信心，基于vue的小程序框架转化，目前的框架中就是uni-app的最好

mpvue项目技术栈：mpvue + fly + vuex + less

uni-app项目：自带fly，处理好了页面结构（和vue神似），vuex默认自带 + less

开始

用脚手架新建一个默认模板

https://uniapp.dcloud.io/

准备操作

引入vant组件， 安装less ， less-loader插件

注意点：微信第三方组件的放置位置，不是根目录，是在src目录下，我之前犯过这个错误，测试基本正常后，就要开始迁移你的项目了

image-20190719113842739

迁移

基本是src目录下的页面，工具函数，页面，api的迁移，我们的主要工作是修改pages.json,接下来我两张截图，分别是mpvue项目和新建uni-app项目

mpvue的page.js

image-20190719114345074

uni-app的page.json

image-20190719114438566

通过对比，迁移项目我们要改三个地方

• 统一“”，该加双引号的，全局替换加双引号

• config换成style

• vant引用地址转化

结束

全部搞定之后，运行代码，基本差不多，功能方面也一致，如有相关问题，欢迎私信或者留言

迁移