Taro + React + Tailwind 开发微信小程序问题汇总(持续更新中...)

搞小程序也有两周了,踩了很多坑,有些问题很难搜索到,在这里记录一下问题和自己的解决方案,希望能帮助到需要的小伙伴~

1. 真机调试报错:Error: module '@babel/runtime/helpers/Arrayincludes.js' is not defined

  • 真机调试模式从 2.0 切换为 1.0 即可解决
  • 要将【转换为 ES5】勾选掉,因为 Taro 通过 webpack 已经将代码编译为 ES5。

2. Taro 中如何使用 weui?

javascript 复制代码
// app.config.ts 
useExtendedLib: { weui: true, }, 
usingComponents: { 'mp-badge': 'weui-miniprogram/badge/badge'...},

3. Taro 动态设置当前页面的标题

4. app.js错误: Error: module 'common.js' is not defined, require args is './common'

  • 偶现,可以先重启 webpack

5. 小程序样式不生效,tailwind 伪类不生效(hover)

6. Error: module 'vendors.js' is not defined

  • 删掉 node_modules 重装

7. fail api scope is not declared in the privacy agreement

8. taro 中配置的 global.d.ts 引入方式不能使用 import,否则因为在头部引用会导致整个 ts 配置文件失效!

  • 正确引入方式:/// <reference types="@tarojs/taro" />。因为在头部错误使用 import 引入类型,导致 declare module '*.png' 不生效

9. object-fit 在小程序中不生效

10. Taro 引入 weui <mp-dialog>其中bindbuttontap按钮点击事件不生效

  • 需要将 bindbuttontap 改成 onButtontap

11. uploadFile:fail createUploadTask:fail url not in domain list

可能有如下原因:

  • uploadFile 合法域名未配置或配置错误
  • 或者是 url 写错(仔细检查一下,我这边就是 url 传错了,忘记添加 baseurl,因为和 get 与 post一起封装的,但是options没有共用)

12. Taro 如何实现手势放缩图片

  • 注意需要配置 scale 才支持放缩
tsx 复制代码
<MovableArea style='height: 200px; width: 200px; background: red;'>
    <MovableView style='height: 50px; width: 50px; background: blue;' direction='all' scale ></MovableView>
</MovableArea>

13. 小程序使用 <mp-dialog> 时弹窗被键盘遮住

  • 配置 input 组件 cursor-spacing 参数,可以指定光标与键盘的距离
相关推荐
软件聚导航3 小时前
「聚小软 AI 助手」技术升级:从数据库检索到 RAG 知识库问答
前端·数据库·mysql·微信小程序·小程序·ai编程·rag
一叶星殇7 小时前
微信小程序 Vant Popup 滚动穿透:页面级与组件级解决方案详解
微信小程序·小程序
2601_9638699513 小时前
【计算机毕业设计】基于微信小程序的点餐传菜系统设计与实现
微信小程序·小程序·课程设计
北漂燕郊杨哥16 小时前
VS Code 安装微信小程序 MCP 介绍
vscode·微信小程序·小程序·mcp
维双云1 天前
2026微信小程序开店用哪个平台?长期稳定运营的系统选择方法
微信小程序·小程序
辛迪聊物业数字化1 天前
【智能楼宇系统有什么用?赋能园区高效 节能 安全】
经验分享·安全·微信小程序·php
Coodor2 天前
使用web也可以写NFC微信小程序拉取
前端·微信小程序·小程序·nfc拉起小程序
太阳之神aboluo2 天前
微信小程序 (1) 基础用法
微信小程序·小程序
黑马程序员毕设3 天前
基于B/S架构的“指尖乡味”助农电商小程序系统设计与实现
spring boot·微信小程序·小程序·架构·课程设计·毕设
编程小橘子4 天前
基于微信小程序健康心理测试、设计与实现 (源码+lw+参考文档+核心代码讲解等)
微信小程序·小程序·毕业设计·毕设