微信小程序> 解决uniapp使用vantweapp开发微信小程序的坑

解决uniapp使用vantweapp开发微信小程序的坑

浏览量:811 时间: 来源:weixin_33744854

这篇文章主要是为使用uniappvant-weappui库的童鞋解决一个痛点。

使用过uniapp开发微信小程序的都知道uniapp内置了es6转es5,如果开启了小程序的es6转es6,那么会导致一些不可预计的语法错误,例如async/await无法使用。

但是如果关闭小程序的es6转es5,那么存放于static目录vant-weapp的组件无法被编译成es5,导致使用组件报错。

核心原因:

由于vant-weapp的模块化机制为import/export,小程序的模块化是require/module.exports

知道原因就好解决了,改源码。手动将引入的组件和组件所依赖的js全部修改为require/module.exports

例子:

1、先修改引入处,

// vant/dist/popup/index.js// -----修改前-------import { VantComponent } from '../common/component';import { transition } from '../mixins/transition';import { iphonex } from '../mixins/iphonex';// -----修改后-------const { VantComponent } = require('../common/component');const { transition } = require('../mixins/transition');const { iphonex } = require('../mixins/iphonex');复制代码

2、再修改导出处,

// vant/dist/common/components.js// ----修改前----export { VantComponent }// ----修改后----module.exports = { VantComponent }复制代码

根据例子,修改完所有引用的文件,即可在不和uniapp的es6编译冲突的情况下使用。

如果觉得这样改很难受,可以去vant-weapp的github骚扰他们反馈。

作者会持续更新遇到的坑和解决方案

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

最新资讯

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎