└── README.md /README.md: -------------------------------------------------------------------------------- 1 | # Awesome Taro 2 | 3 | 多端统一开发框架 Taro 优秀学习资源汇总 [![Awesome](https://awesome.re/badge-flat.svg)](https://awesome.re) 4 | 5 | ## 官方资源 6 | 7 | - [Taro 项目仓库](https://github.com/NervJS/taro) 8 | - [Taro 官方文档](http://nervjs.github.io/taro) 9 | - [Taro UI 项目仓库](https://github.com/NervJS/taro-ui) 10 | - [Taro UI 官方文档](https://taro-ui.jd.com) 11 | - [微信小程序官方文档](https://developers.weixin.qq.com/miniprogram/dev/framework/) 12 | - [百度智能小程序官方文档](https://smartprogram.baidu.com/docs/develop/tutorial/intro/) 13 | - [支付宝小程序官方文档](https://docs.alipay.com/mini/developer/getting-started) 14 | - [字节跳动小程序官方文档](https://microapp.bytedance.com/) 15 | - [京东小程序官方文档](https://mp.jd.com/docs/dev/) 16 | - [QQ 小程序官方文档](https://q.qq.com/wiki/) 17 | 18 | ## 生态资源 19 | 20 | - [Taro UI](https://taro-ui.jd.com) 21 | - [Taro UI Vue3](https://b2nil.github.io/taro-ui-vue3/) 22 | - [Taro UI Vue](https://github.com/psaren/taro-ui-vue) 23 | - [Taroify UI](https://taroify.gitee.io/taroify.com/introduce/) 24 | - [更多](https://nervjs.github.io/taro/docs/redux) 25 | 26 | ## 文章教程 27 | 28 | - [官方博客](https://nervjs.github.io/taro/blog) 29 | - [不敢阅读 npm 包源码?带你揭秘 taro init 背后的哲学](https://juejin.im/post/5c21f4e5f265da61117a54a0) 30 | - [从 0 到 1 构建适配不同端(微信小程序、H5、React-Native 等)的 taro + dva 应用](https://juejin.im/post/5bb1766d5188255c3272cdd0) 31 | - [【小程序 taro 最佳实践】http 请求封装(方便使用,增加 token,统一错误日志记录和上报)](https://segmentfault.com/a/1190000016533592) 32 | - [【小程序 taro 最佳实践】异步 action 优雅实践(简化流程)](https://segmentfault.com/a/1190000016534001) 33 | - [使用 Taro 框架开发小程序](https://juejin.im/post/5ba0a53af265da0ab5037234) 34 | - [Taro 下利用 Decorator 快速实现小程序分享](https://juejin.im/post/5b99da5d5188255c6f1e084e) 35 | - [微信小程序授权登陆方案以及在 Taro 下利用 Decorator 修饰器实现](https://juejin.im/post/5b97a762e51d450e9649a8fd) 36 | - [试用 React 语法的多端框架 Taro 问题汇总](https://segmentfault.com/a/1190000016247153) 37 | - [Taro 在京东购物小程序上的实践](https://juejin.im/entry/5b987859e51d450ea2465ddd) 38 | - [Taro 实践 - TOPLIFE 小程序 开发体验](https://juejin.im/post/5b3b786a6fb9a04f89780a9f) 39 | - [Taro 技术揭秘:taro-cli](https://juejin.im/post/5b3ce041e51d45194832aaf6) 40 | - [为何我们要用 React 来写小程序 - Taro 诞生记](https://juejin.im/post/5b30b476518825749e4a1d91) 41 | - [GitLab-CI 微信小程序进行持续集成和持续部署](https://zacksleo.github.io/2018/04/08/GitLab-CI%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8%8B%E5%BA%8F%E8%BF%9B%E8%A1%8C%E6%8C%81%E7%BB%AD%E9%9B%86%E6%88%90%E5%92%8C%E6%8C%81%E7%BB%AD%E9%83%A8%E7%BD%B2/) 42 | - [使用 Taro 和 Typescript 进行小程序开发](https://zacksleo.github.io/2018/06/16/%E4%BD%BF%E7%94%A8Taro%E5%92%8CTypescript%E8%BF%9B%E8%A1%8C%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%BC%80%E5%8F%91/) 43 | - [微信小程序及 h5,基于 taro,zoro 最佳实践探索](https://www.jianshu.com/p/7c27dbbc080f) 44 | - [手把手教你用 Taro 框架写一个图像处理类微信小程序](https://juejin.im/post/5c3c8c58f265da611a4813a9) 45 | - [Taro 多端开发的正确姿势:打造三端统一的网易严选(小程序、H5、React Native)](https://juejin.im/post/5c6a151f518825625e4ac830) 46 | - [Taro 与 Redux 结合使用教程](https://github.com/imageslr/taro-library#%E5%BC%95%E5%85%A5-redux) 47 | - [微信小程序开发之影分身术](https://juejin.im/post/5c788d28e51d4560a82be8d2) 48 | - [Taro 3.x 跨版本升级踩坑指南(将 Taro 3.0.14 跨版本升级到 Taro 3.5.3 项目实战)](https://juejin.cn/post/7148430666906992647) 49 | 50 | ## 开发技巧 51 | 52 | - [微信小程序 wx.request 对于 JSON 含 \u2028 处理异常](https://segmentfault.com/a/1190000015443614) 53 | - [Taro 最佳实践](https://github.com/js-newbee/taro-best-practices) 54 | - [封装 Taro.request(拦截器,url 配置等)](https://github.com/TigerHee/taro-request) 55 | - [使用 axios 完美代替 Taro.request](https://github.com/SpringHgui/axios-taro-adapter) 56 | 57 | ## 示例项目 58 | 59 | ### Taro 3.2 60 | 61 | - [Taro App 开发调试工具及使用示例](https://github.com/wuba/taro-playground) 62 | - [【58出品】Taro 跨平台 demo,支持 React Native,Weapp,H5](https://github.com/wuba/Taro-Mortgage-Calculator) 63 | - [瑞克和莫蒂wiki,支持 React Native,Weapp,H5](https://github.com/rick-and-morty-wiki/rick-and-morty-wiki) 64 | 65 | ### Taro 3 66 | 67 | - [TodoMVC React 版](https://github.com/NervJS/TodoMVC/tree/react) (小程序 / H5) 68 | - [TodoMVC Vue 版](https://github.com/NervJS/TodoMVC/tree/vue) (小程序 / H5) 69 | - Taro 组件库示例 [taro-components-sample](https://github.com/NervJS/taro-components-sample) (默认是 React,Vue 请切到 Vue 分支) 70 | - [仿知乎小程序 React 版](https://github.com/NervJS/taro-zhihu-sample/tree/next) 71 | - [仿知乎小程序 Vue 版](https://github.com/NervJS/taro-zhihu-sample/tree/vue) 72 | - [V2ex 小程序(TypeScript) React 版](https://github.com/NervJS/taro-v2ex/tree/next) 73 | - [V2ex 小程序(TypeScript)Vue 版](https://github.com/NervJS/taro-v2ex/tree/vue) 74 | - [与微信小程序原生融合的示例(React版)](https://github.com/NervJS/taro-sample-weapp/tree/next) 75 | - [与微信小程序原生融合的示例(Vue版)](https://github.com/NervJS/taro-sample-weapp/tree/vue) 76 | - [Taro 示例项目(DVA计数器 | 异步请求 | 腾讯地图): Taro+Dva+Typescript+Immer](https://github.com/didilinkin/tarojs-ts-cli) 77 | - 💯 [nice-router-taro 脚手架项目,DVA+数据驱动页面+数据驱动表单+数据驱动list](https://github.com/kala888/nice-router-taro) 78 | - [抖音一键去水印小程序 (Vue版): Taro + 微信云开发](https://github.com/terryso/super9) 79 | - [彗星密码本 (React版): Taro + 微信云开发](https://github.com/MuxinFeng/taro-savePassword) 80 | 81 | ### Taro 2 82 | 83 | - Taro Redux 示例 [taro-redux-sample](https://github.com/NervJS/taro-redux-sample) 84 | - [TodoMVC](https://github.com/NervJS/TodoMVC) (小程序/H5/React Native) 85 | - Taro 组件库示例 [taro-components-sample](https://github.com/NervJS/taro-components-sample/tree/master) 86 | - [Taro 脚手架(特性: 封装 api、redux 优雅集成、异常日志上报)](https://github.com/wsdo/taro-kit.git) 87 | - [仿知乎小程序](https://github.com/NervJS/taro-zhihu-sample) 88 | - [仿知乎小程序: Taro + Taro-UI + yapi API](https://github.com/MoonCheung/zhihu-applet) 89 | - [V2ex 小程序(TypeScript)](https://github.com/NervJS/taro-v2ex) 90 | - [与微信小程序原生融合的示例](https://github.com/NervJS/taro-sample-weapp) 91 | - [记日常小程序 Taro-UI + Rematch + 云开发 + tcb-router](https://github.com/zhixiaoqiang/taroCloud) 92 | - 💯 [nice-router-taro 脚手架项目,DVA+数据驱动页面+数据驱动表单+数据驱动list](https://github.com/kala888/nice-router-taro/tree/taro2) 93 | - [基于`Taro2` + 云开发 打造婚礼邀请函小程序](https://github.com/wforguo/wedding-app) 94 | ### Taro 1 95 | 96 | - Taro 端能力示例 [taro-apis-sample](https://github.com/NervJS/taro-apis-sample) 97 | - Taro 实验性特性项目 [taro-todo](https://github.com/NervJS/taro-todo) 98 | - [Taro 整合 Dva 示例](https://github.com/zuoge85/taro-dva) 99 | - [taro 结合 zoro 完整方案示例](https://github.com/FaureWu/ztaro) 100 | - [Taro-UI + Rematch 示例](https://github.com/qwIvan/taro-demo-todolist) 101 | - [Taro+dva+wxParse 多端富文本解析示例](https://github.com/zcSkr/taro-dva-wxParse) 102 | - [Taro+Taro-UI+es6 入门 demo](https://github.com/hyyqcweb/taro-gank) 103 | - [知识付费小程序(TypeScript)](https://github.com/SmallRuralDog/yundocs) 104 | - [书店小程序: Taro + Redux + 本地 Mock Server 示例项目](https://github.com/imageslr/taro-library) 105 | - [Taro 示例项目(内置 计数器 与 异步请求): Taro + Dva + Typescript + Immutable](https://github.com/didilinkin/elf-taro-cli/tree/taro-1.2.8) 106 | 107 | ## 开源项目 108 | 109 | ### Taro3.2 110 | 111 | - [taro-rn-demo](https://github.com/wyzwhp/taro-rn-demo) 112 | - [Taroify UI](https://taroify.gitee.io/taroify.com/introduce/) 113 | 114 | ### Taro3 115 | 116 | - [Taro UI Vue3](https://b2nil.github.io/taro-ui-vue3/) 117 | - [Taro UI Vue](https://github.com/psaren/taro-ui-vue) 118 | - [基于 Taro + Taro-ui + Typescript + redux 开发的网易云音乐小程序](https://github.com/lsqy/taro-music/tree/feature_upgrade_taro3.0) 119 | - [微信小程序每日工作量(vue3 + TS + 云开发)](https://github.com/whyour/mini-work) 120 | - [TaroForm可视化表单编辑](https://github.com/ShaoGongBra/taro-form) 121 | - [自媒体UP主团购小程序NiceUp(React + TS + 云开发)](https://github.com/nasawz/niceup) 122 | - [taro-hooks 为Taro而设计的Hooks Library](https://github.com/innocces/taro-hooks) 123 | - [Taro HtmlView 支持将简单的html富文本渲染为Taro组件](https://github.com/ShaoGongBra/taro-html-view) 124 | - [让我们一起手拉手小程序, taro+vue3+ts+pinia,社区、问卷、对话](https://github.com/Everytimeyumi/hand-in-hand/tree/main) 125 | 126 | ### Taro2 127 | 128 | - 💯 [Hi头像](https://github.com/hi-our/hi-face) 自带[教程小册](https://www.xiaoxili.com/hi-face) 129 | - 💯 [基于 Taro2.0 + dva + Taro-ui + immer 开发的电商小程序](https://github.com/jiechud/taro-mall) 130 | - 💯 [基于 Taro2.0 + TypeScript + 云开发的地图同学录小程序](https://github.com/Mayandev/classmate-map) 131 | - [基于 Taro + Taro-ui + Typescript + redux 开发的网易云音乐小程序](https://github.com/lsqy/taro-music) 132 | - [基于 Taro2.0 + dva + Taro-ui + wemark 开发的 markdown 文章博客小程序](https://github.com/hirCodd/JavaNorthMiniApp.git) 133 | - [基于`Taro2` + 云开发 打造婚礼邀请函小程序](https://github.com/wforguo/wedding-app) 134 | - 135 | ### Taro1 136 | 137 | - 💯 [首个 Taro 多端统一实例 - 网易严选(小程序 + H5 + React Native)](https://github.com/js-newbee/taro-yanxuan) 138 | - 💯 [基于 Taro + Dva 构建的时装衣橱(电商实战项目)](https://github.com/EasyTuan/taro-msparis) 139 | - 💯 [基于 Taro + Taro-ui + dva 开发的公益 App](https://github.com/hugetiny/quit-smoking) 140 | - 💯 [github 上能找到的 taro 适配 Android、iOS、微信小程序、H5 最佳实践项目脚手架](https://github.com/bozaigao/Taro-demo) 141 | - [Taro 掘金小册源码](https://github.com/o2team/taro-ebook-source) 142 | - [基于 taro + dva 开发的音乐播放器小程序](https://github.com/huangzhuangjia/taro-music) 143 | - [Taro + Taro-UI GitHub 小程序客户端 Gitter 源码](https://github.com/huangjianke/Gitter) 144 | - [基于 Taro + dva + Taro-ui + Typescript 开发的网易云音乐小程序](https://github.com/abc-club/taro-music-ts) 145 | 146 | ## 第三方库和组件 147 | 148 | - [f2 图表封装 兼容 H5 和微信小程序](https://github.com/xioxin/taro-f2)(Taro 1.x) 149 | - [echarts 图表封装](https://github.com/WsmDyj/echarts-for-taro)(Taro 1.x) 150 | - [taro-plugin-canvas - 基于 Taro 的小程序海报组件](https://github.com/chuyun/taro-plugin-canvas)(Taro 3.x) 151 | - [taro-bdmark - 基于 Taro 的百度小程序 md 解析器](https://github.com/guozimo/taro-bdMark)(Taro 1.x) 152 | - [Mounted - 一款基于 Taro 的小程序组件库](https://github.com/fjc0k/mounted)(Taro 1.x) 153 | - [taro-axios - 在 Taro 中使用 axios](https://github.com/fjc0k/taro-axios)(Taro 1.x;2.x;3.x) 154 | - [TaroCreator - 基于Taro UI的小程序可视化设计工具](https://github.com/mpfast/TaroCreator)(Taro 2.x) 155 | - [taro-luck-draw - 🍧🍧🍧 基于 taro 的【大转盘 / 九宫格】抽奖插件](https://github.com/LuckDraw/taro-luck-draw)(Taro 3.x) 156 | - [tarojs-router-next - Taro 路由库/自动生成/任意传参/同步的路由方法调用/路由中间件](https://github.com/lblblong/tarojs-router-next)(Taro 3.x) 157 | - [Taroify UI - 使用 Vant 相同的视觉规范的 Taro 组件库](https://taroify.gitee.io/taroify.com/introduce/)(Taro 3.x) 158 | - [taro-hooks 为Taro而设计的Hooks Library](https://github.com/innocces/taro-hooks)(Taro 3.x) 159 | - [taro-visualization Taro 可视化库(charts、3d、Lottie等)](https://github.com/wuba/taro-visualization)(Taro 3.x) 160 | - [taro-svga Taro 使用svga动画库(资源体积更小、更高效、跨平台),支持weapp、h5 、tt、rn](https://github.com/wukongyang/taro-svga)(Taro 3.x) 161 | - [taro-code-creator Taro 条形码、二维码生成器,全平台支持](https://github.com/wukongyang/taro-code-creator)(Taro 3.x) 162 | --------------------------------------------------------------------------------