项目介绍：原始遗留项目，用的wepy1.6.0，运营想加友盟统计，结果发现友盟并不友好，仅支持wepy2.0以上版本，无奈只得升级框架，用了将近一周的时间才升级完，感觉2是vue和小程序原生的结合体，跟1已经没有太大关系，想升级的老铁做好心理准备；
1、首先需要全局安装wepy脚手架，1.x和2.x的脚手架不一样；
npm install @wepy/cli -g # 全局安装 WePY CLI 工具
建议先自己初始化一个wepy2的项目模板，然后对照更改；
wepy init standard myproj # 使用 standard 模板初始化项目
2、首先按照新建的wepy2模板将package.json和wepy.config.js中奖基础依赖包更新；
主要注意wepy.config.js中的babel需要更改；
1.x配置：
compilers: {
less: {
compress: prod
},
babel: {
sourceMap: true,
presets: [ "env" ],
plugins: [
"transform-class-properties",
"transform-decorators-legacy",
"transform-object-rest-spread",
"transform-export-extensions"
]
}
},
2.x配置：
compilers: { less: { compress: prod, }, babel: { sourceMap: true, presets: ['@babel/preset-env'], plugins: ['@wepy/babel-plugin-import-regenerator'], }, },
3、注意打包后生成的文件夹，1.x是dist，2.x是weapp。需要更改project.config.json中的
"miniprogramRoot": "weapp/",
4、需要更改静态资源文件目录，我们原来的是assets，需要在wepy.config.js将该目录配置上；
static: ['src/assets'],
5、开始更改.wpy文件，首先wepy引入方式改为：
import wepy from '@wepy/core';
其次写法简化：export default class extends 不再需要，直接用wepy.app({})即可；
最后，config的配置，需要放到script标签外边，用config标签包裹；
<config> { pages: [ 'pages/home/home', 'pages/web-view/web-view', 'pages/login-register/login' ], window: { backgroundColor: '#f4f4f4', backgroundTextStyle: 'dark', navigationBarBackgroundColor: '#fff', }, tabBar: { color: '#888888', selectedColor: '#FE681C', backgroundColor: '#ffffff', borderStyle: 'black', list: [ { selectedIconPath: './assets/icon/toolbar_class_per.png', iconPath: './assets/icon/toolbar_class_nor.png', pagePath: 'pages/home/home', text: '首页', } ], }, usingComponents: { 'van-popup': './vant/popup/index', 'van-tab': './vant/tab/index', }, networkTimeout: { request: 15000, }, plugins: { captcha: { version: '1.1.0', provider: '12345678', }, }, }</config>
注意：wepy2已经默认支持async，不用再单独引入wepy-async-function插件；
6、页面和组件中也不在需要export default class extends 直接用wepy.page({})和wepy.component({})包裹就行；需要注意的是组件引用方式不能再用import的方式；
改为在config中usingComponents引入
<config> { navigationBarTitleText: '积分商城', enablePullDownRefresh: true, onReachBottomDistance: 50, usingComponents: { loadMore: "~@/base/load-more/load-more", defaultPage: "~@/base/DefaultPage/default" } }</config>
7、页面中自定义的函数，需要全部放到methods中，不能再出现函数和生命周期函数同级的情况，否则在调用的时候会报错，找不到该函数；
8、页面中wx:for改为v-for（同vue），而且函数传参方式也需要更改：
<block v-for="(item,index) in productList" :key="index"> <view class="product" @tap="goDetails(item.goodsId)">
wx:if和v-if兼容，如果用v-if，变量的{{}}需要去掉；
{{score}}
9、全局变量的获取改为：this.$app.$options.globalData
10、input等数据绑定中数据获取方式改为：
onInput(e) { const value = e.$wx.detail.value; },
11、不用再手动更新数据变化，详见官方文档说明：
12、组件生命周期改为了原生小程序一样，详见小程序文档：小程序组件详情
13、父传子：原来的$broadcast取消了，目前只能用$wx.selectComponent('#id').方法名(data)来调用子组件方法；
子传父还用原来的this.$emit('tap')；
**注意：**更改中发现$wx.selectComponent 调用子组件中的方法后，子组件的data定义的数据会变成underfind；
// 父组件通过$wx.selectComponent('#calendar')触发该函数时，this.calendar为underfind; // 原因未知，通过将this.calendar存储到缓存来解决该问题 this.calendar = wx.getStorageSync('calendar');
14、原来wepy的跳转页面也都改为原生的wx跳转了；
wx.navigateTo({ url: '/pages/live/live?courseId=' + data.courseId + '&classLessonId=' + data.classLessonId });
