taro微信小程序兼容支付宝小程序记录

465 阅读1分钟

1.添加支付宝小程序配置文件mini.project.json,详情查看Taro官网的这里docs.taro.zone/docs/projec… ,然后进入支付宝小程序的mini.project.json,添加完成执行npm run build:alipay -- --watch

出现如下页面说明编译成功,然后打开支付宝小程序开发工具进行查看

image.png

2.进入支付宝小程序开发工具之后,关联小程序,开发工具右上角-》详情-》应用名称(选择对应的支付宝小程序,关联之前需要在支付宝控台绑定,否则无法找到关联的小程序),关联之后项目代码改变之后,小程序会实时更新

image.png

3.处理运行报错,这个每个人问题不一样,记录下我这里报错信息

(1)error[Resolve]: cannot resolve module '/xxxx/dist/alipay/customize-tab-bar/index.axml?/',意思在编译的alipay里面没有对应的axml,去对应文件找确实没有发现,只有微信的相关文件,

image.png 正常编译成支付宝小程序之后后缀应该是axml,axss,原来是因为微信小程序支持自定义tabbar,支付宝小程序不支持自定义tabbar,tabbar里面的custom属性区分平台就行了

解决方法:在app.config.js里面设置tabbar的地方,区分小程序平台即可

tabBar: process.env.c === 'weapp' ? {} :{}

(2)应用插件不存在

image.png 这个问题是由于app.config.js里面引用的插件plugins,微信小程序里面有,支付宝小程序没有这个插件,区分判断下就可以了

4小程序终于跑起来了,但是,但是,白屏,继续修改