Taro多端统一开发解决方案

Taro 文档

Taro | 多端统一开发解决方案

Taro是什么？

Taro 是一个开放式跨端跨框架解决方案，支持使用 React/Vue/Nerv 等框架来开发 微信 / 京东 / 百度 / 支付宝 / 字节跳动 / QQ / 飞书 小程序 / H5 / RN 等应用。

现如今市面上端的形态多种多样，Web、React Native、微信小程序等各种端大行其道。当业务要求同时在不同的端都要求有所表现的时候，针对不同的端去编写多套代码的成本显然非常高，这时候只编写一套代码就能够适配到多端的能力就显得极为需要。

GitHub - NervJS/taro: 开放式跨端跨框架解决方案，支持使用 React/Vue/Nerv 等框架来开发微信/京东/百度/支付宝/字节跳动/ QQ 小程序/H5/React Native 等应用。 https://taro.zone/

多端支持哪些？

一处代码，多处运行

• 微信小程序
• 京东小程序
• H5
• 百度小程序
• 支付宝小程序
• 快应用
• ReactNative
• 字节跳动小程序
• QQ 轻应用

Taro UI

一款基于 Taro 框架开发的多端 UI 组件库

特性

• 基于 Taro 开发 UI 组件
• 一套组件可以在 微信小程序，支付宝小程序，百度小程序，H5，ReactNative 多端适配运行
• 提供友好的 API，可灵活的使用组件

Awesome Taro

多端统一开发框架 Taro 优秀学习资源汇总 : https://awesome.re

官方资源

• Taro 项目仓库
• Taro 官方文档
• Taro UI 项目仓库
• Taro UI 官方文档
• 微信小程序官方文档
• 百度智能小程序官方文档
• 支付宝小程序官方文档
• 字节跳动小程序官方文档
• 京东小程序官方文档
• QQ 小程序官方文档

生态资源

• Taro UI
• Taro UI Vue3
• Taro UI Vue
• Taroify UI
• 更多

文章教程

• 官方博客
• 不敢阅读 npm 包源码？带你揭秘 taro init 背后的哲学
• 从 0 到 1 构建适配不同端（微信小程序、H5、React-Native 等）的 taro + dva 应用
• 【小程序 taro 最佳实践】http 请求封装（方便使用，增加 token，统一错误日志记录和上报）
• 【小程序 taro 最佳实践】异步 action 优雅实践(简化流程)
• 使用 Taro 框架开发小程序
• Taro 下利用 Decorator 快速实现小程序分享
• 微信小程序授权登陆方案以及在 Taro 下利用 Decorator 修饰器实现
• 试用 React 语法的多端框架 Taro 问题汇总
• Taro 在京东购物小程序上的实践
• Taro 实践 - TOPLIFE 小程序 开发体验
• Taro 技术揭秘：taro-cli
• 为何我们要用 React 来写小程序 - Taro 诞生记
• GitLab-CI 微信小程序进行持续集成和持续部署
• 使用 Taro 和 Typescript 进行小程序开发
• 微信小程序及 h5,基于 taro，zoro 最佳实践探索
• 手把手教你用 Taro 框架写一个图像处理类微信小程序
• Taro 多端开发的正确姿势：打造三端统一的网易严选（小程序、H5、React Native）
• Taro 与 Redux 结合使用教程
• 微信小程序开发之影分身术
• Taro 3.x 跨版本升级踩坑指南（将 Taro 3.0.14 跨版本升级到 Taro 3.5.3 项目实战）

开发技巧

• 微信小程序 wx.request 对于 JSON 含 \u2028 处理异常
• Taro 最佳实践
• 封装 Taro.request（拦截器，url 配置等）
• 使用 axios 完美代替 Taro.request

示例项目

Taro 3.2

• Taro App 开发调试工具及使用示例
• 【58出品】Taro 跨平台 demo，支持 React Native，Weapp，H5
• 瑞克和莫蒂wiki，支持 React Native，Weapp，H5

Taro 3

• TodoMVC React 版 (小程序 / H5)
• TodoMVC Vue 版 (小程序 / H5)
• Taro 组件库示例 taro-components-sample （默认是 React，Vue 请切到 Vue 分支）
• 仿知乎小程序 React 版
• 仿知乎小程序 Vue 版
• V2ex 小程序（TypeScript） React 版
• V2ex 小程序（TypeScript）Vue 版
• 与微信小程序原生融合的示例（React版）
• 与微信小程序原生融合的示例（Vue版）
• Taro 示例项目(DVA计数器 | 异步请求 | 腾讯地图): Taro+Dva+Typescript+Immer
• 💯 nice-router-taro 脚手架项目，DVA+数据驱动页面+数据驱动表单+数据驱动list
• 抖音一键去水印小程序 (Vue版): Taro + 微信云开发
• 彗星密码本 (React版): Taro + 微信云开发

Taro 2

• Taro Redux 示例 taro-redux-sample
• TodoMVC (小程序/H5/React Native)
• Taro 组件库示例 taro-components-sample
• Taro 脚手架（特性： 封装 api、redux 优雅集成、异常日志上报）
• 仿知乎小程序
• 仿知乎小程序: Taro + Taro-UI + yapi API
• V2ex 小程序（TypeScript）
• 与微信小程序原生融合的示例
• 记日常小程序 Taro-UI + Rematch + 云开发 + tcb-router
• 💯 nice-router-taro 脚手架项目，DVA+数据驱动页面+数据驱动表单+数据驱动list
• 基于Taro2 + 云开发 打造婚礼邀请函小程序

Taro 1

• Taro 端能力示例 taro-apis-sample
• Taro 实验性特性项目 taro-todo
• Taro 整合 Dva 示例
• taro 结合 zoro 完整方案示例
• Taro-UI + Rematch 示例
• Taro+dva+wxParse 多端富文本解析示例
• Taro+Taro-UI+es6 入门 demo
• 知识付费小程序（TypeScript）
• 书店小程序： Taro + Redux + 本地 Mock Server 示例项目
• Taro 示例项目(内置 计数器 与 异步请求): Taro + Dva + Typescript + Immutable

开源项目

Taro3.2

• taro-rn-demo
• Taroify UI

Taro3

• Taro UI Vue3
• Taro UI Vue
• 基于 Taro + Taro-ui + Typescript + redux 开发的网易云音乐小程序
• 微信小程序每日工作量(vue3 + TS + 云开发)
• TaroForm可视化表单编辑
• 自媒体UP主团购小程序NiceUp(React + TS + 云开发)
• taro-hooks 为Taro而设计的Hooks Library
• Taro HtmlView 支持将简单的html富文本渲染为Taro组件
• 让我们一起手拉手小程序, taro+vue3+ts+pinia,社区、问卷、对话

Taro2

• 💯 Hi头像 自带教程小册
• 💯 基于 Taro2.0 + dva + Taro-ui + immer 开发的电商小程序
• 💯 基于 Taro2.0 + TypeScript + 云开发的地图同学录小程序
• 基于 Taro + Taro-ui + Typescript + redux 开发的网易云音乐小程序
• 基于 Taro2.0 + dva + Taro-ui + wemark 开发的 markdown 文章博客小程序
• 基于Taro2 + 云开发 打造婚礼邀请函小程序

Taro1

• 💯 首个 Taro 多端统一实例 - 网易严选（小程序 + H5 + React Native）
• 💯 基于 Taro + Dva 构建的时装衣橱(电商实战项目)
• 💯 基于 Taro + Taro-ui + dva 开发的公益 App
• 💯 github 上能找到的 taro 适配 Android、iOS、微信小程序、H5 最佳实践项目脚手架
• Taro 掘金小册源码
• 基于 taro + dva 开发的音乐播放器小程序
• Taro + Taro-UI GitHub 小程序客户端 Gitter 源码
• 基于 Taro + dva + Taro-ui + Typescript 开发的网易云音乐小程序

第三方库和组件

• f2 图表封装 兼容 H5 和微信小程序（Taro 1.x）
• echarts 图表封装（Taro 1.x）
• taro-plugin-canvas - 基于 Taro 的小程序海报组件(Taro 3.x)
• taro-bdmark - 基于 Taro 的百度小程序 md 解析器（Taro 1.x）
• Mounted - 一款基于 Taro 的小程序组件库（Taro 1.x）
• taro-axios - 在 Taro 中使用 axios（Taro 1.x；2.x;3.x）
• TaroCreator - 基于Taro UI的小程序可视化设计工具（Taro 2.x）
• taro-luck-draw - 🍧🍧🍧 基于 taro 的【大转盘 / 九宫格】抽奖插件（Taro 3.x）
• tarojs-router-next - Taro 路由库/自动生成/任意传参/同步的路由方法调用/路由中间件（Taro 3.x）
• Taroify UI - 使用 Vant 相同的视觉规范的 Taro 组件库（Taro 3.x）
• taro-hooks 为Taro而设计的Hooks Library（Taro 3.x）
• taro-visualization Taro 可视化库（charts、3d、Lottie等）（Taro 3.x）
• taro-svga Taro 使用svga动画库（资源体积更小、更高效、跨平台），支持weapp、h5 、tt、rn（Taro 3.x）
• taro-code-creator Taro 条形码、二维码生成器，全平台支持（Taro 3.x）