社区优质物料

本篇收录了社区在 Taro 物料市场 贡献的各种优质物料。

注意：平台支持度没有打 ✔️ 的，意思是尚未验证，不代表完全不支持。

如何贡献

欢迎各位开发者为 Taro 社区贡献物料。可以通过以下步骤进行贡献、引流、讨论，共同成长：

1. 提交物料到 Taro 物料市场，并提供完善的文档。
2. 修改本文档，为物料添加说明。
3. 在 Taro 讨论组 添加一条讨论，与开发者进行沟通。

模板项目

---

网易云音乐小程序

React

🎉 基于 Taro + Taro UI + Redux + React Hooks + Typescript 开发的网易云音乐小程序。

@lsqy 出品。【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

nice-router-taro

React

nice-router 第 0 适合后端程序员的前端小程序开发框架。

@kala888 出品。【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

小溪里博客小程序

React

小溪里博客小程序。基于 Taro 3.3+，使用 HTML 标签开发。

@shenghanqin 出品。【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

房贷计算器

React

首个 Taro 3 多端统一实例 - 支持 React Native，Weapp，H5。

58 同城团队出品。【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️				✔️	✔️

---

《瑞克和莫蒂》Wiki

React

基于 Taro3.2+ 的多端统一项目。在这里可以查看几乎所有在《瑞克和莫蒂》中出现的人物，外加专为铁粉准备的小游戏。

@ 出品。【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️				✔️	✔️

---

南歌文化电子票销售小程序

React

基于 Taro 3.0.27 的开发的电子票（景点、餐饮、夜店）销售小程序，使用了 React + React Hooks + TypeScript + React-Redux。

@sskcal 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

微信小程序每日工作量

Vue

记录每日工作量，统计日工资，月工资。

@whyour 出品。【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️	✔️

---

niceup

React

这是一款针对自媒体从业者专门开发的微信团购小程序。

@nasawz 出品。【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

taro-mall

React

Taro_Mall 是一款多端开源在线商城应用程序，后台是基于 litemall 基础上进行开发，前端采用 Taro 框架编写，现已全部完成小程序和 H5 移动端，后续会对 APP，淘宝，头条，百度小程序进行适配。Taro_Mall 已经完成了 litemall 前端的所有功能。

@jiechud 出品。【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

Vue3 + TS 快速开发模板

Vue3

基于 Taro 3.x & Vue 3 & TypeScript 的快速开发模板。

@RealCoolSnow 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️

---

React + Dva + Less 模板

React

这是一份基于 Taro 3.x 的模版。 - DvaJS - Taro - Less - React。

@hocgin 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️

---

elf-taro

React

Taro 小程序 脚手架 (Taro 3 + Dva + Typescript + Immer) - 内置 Redux 计数器, 异步数据请求 与 腾讯小程序地图 demo。

@didilinkin 出品。【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

taro-kit

React

Taro 小程序脚手架。 特性： 封装 api、redux 优雅集成、生成海报类，异常日志上报。

@wsdo 出品。【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

样式库

NutUI

Vue3

支持多端开发的 Vue 组件库

@jdf2e 出品。【官网】【Github】

	微信	京东	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️			✔️

---

taro-ui-vue

Vue

Taro UI 的 Vue 实现。

@psaren 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️				✔️

---

taro-ui-vue3

Vue3

采用 Vue 3.0 重写的 Taro UI 组件库。

@b2nil 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️

---

Taroify

React

Taroify 是移动端组件库 Vant 的 Taro 版本，两者基于相同的视觉规范，提供一致的 API 接口，助力开发者快速搭建小程序应用。

@Taroify 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️

---

taro-color-ui

React

本项目基于 ColorUI 封装了一些常用的组件，无需下载 ColorUI 的 demo 查看各种实现的 classname， 减少手动将 demo 中的 wxml 书写格式改写为 Taro jsx 格式 等一系列烦琐的工作， 可以直接使用 jsx 组件的方式使用，支持按需导入样式。

@Gengar-666 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️

---

@antmjs/vantui

React

@antmjs/vantui 是一款基于 vant 开发的 React / Taro-React 多端 UI 组件库。

@antmjs 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️

---

Tard

React

Tard 是一套基于 Taro 框架开发的多端 React UI 组件库。

@jd-antelope 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️

---

插件

---

编译提速插件

采用多核心和缓存提升 Taro 编译打包速度。详情请阅读文章《编写插件，将 Taro 编译打包耗时缩短至三分之一》。

智行小程序团队出品。【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️

---

骨架屏插件

让你的 Taro3 页面更流畅，Taro page 初始化 setData() 需要传递一个比较大的数据，导致初始化页面时会一段白屏的时间，该插件可以解决这个问题。

@allen-hu-666 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️

---

tailwindcss 插件

Taro 接入 tailwindcss 2.0 插件。

@pcdotfan 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️

---

动态加载代码插件

React

基于 Taro 3.0+、webpack 插件、babel 的小程序端动态加载代码实现。

@JiyuShao 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

命令行创建组件/页面插件

Taro 页面/组件创建工具，全部使用函数式组件 + Typescript + Hooks，提供良好的页面提示。

@liuhuapiaoyuan 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️	✔️

---

兼容 wsl 插件

打包内容(rsync)同步到 Windows 文件下,解决 wsl2 下(\\wsl$) 打包出的小程序文件直接从开发工具读会无法读取到的正确内容

@toknT 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️	✔️

---

taro-plugin-pinia 支持使用 Pinia 进行状态管理

Taro & vue3 支持使用 Pinia 进行状态管理的插件

@keyding 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️

---

组件

---

虚拟列表

React

基于 Taro3 封装的虚拟列表组件，支持列表子节点不等高，白屏率比官方的要低，性能更好，使用方便简单。

携程团队出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️

---

商品双向联动列表

React

功能不受布局位置 和 内容数据的影响，全由 JS 动态计算获取的商品双向联动列表。

【物料详情】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️

---

下拉式筛选菜单

React

商城，团购常用的下拉式筛选菜单，最多支持 3 级子菜单，支持多选/单选筛选。

【物料详情】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️

---

抽奖插件

React & Vue

🍧🍧🍧 基于 taro 实现的【大转盘 / 九宫格】抽奖插件，🎨 奖品 / 文字 / 图片 / 颜色 / 按钮均可配置，支持同步 / 异步抽奖，🎯 概率前 / 后端可控，可搭配 rpx 适配移动端。

@LuckDraw 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️				✔️

---

日历热力图

React

基于 Taro 的日历热力图，生成类似与 GitHub Contribution 统计图。

@Mayandev 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

弧形进度条

React

弧形进度条，单个模板。

【物料详情】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

手写签名

React

Taro 的手写签名库。

@yz1311 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

日期时间选择组件

React

基于 pickerView、pickerViewColumn 来自定义了一个选择器用于日期和时间在用一个组件中选择完成。项目使用 Taro 框架，也可实现类似微信提醒的时间选择器。

@jarbozhang 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

wPicker

React

日期、时间、多级联动 picker。

【物料详情】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

时间选择器

React

时间选择器。

【物料详情】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

日期选择器

Vue

用的 vue 开发，业务需求一个选择日期区间的组件，只能结合别人的手动弄一个，部分功能还没有完全调完，有空再完善

【物料详情】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

多功能表格组件

React

基于 Taro3、React 的微信小程序端多功能表格组件。

@qxtang 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

echarts-taro3-react

React

基于 Taro3.x 版本构建的微信小程序 echarts 组件。

@Cecilxx 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

echarts-taro3-vue

Vue

Taro3.x-Vue 构建的微信小程序 echarts 组件。

@Cecilxx 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

taro3-react-f2

React

Taro3 集成图表库 f2。

@tomalloc 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️

---

taro-vchart

React

Taro3 集成图表库 @visactor/vchart。

@visactor 出品。【物料详情】【Github】【使用教程】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️			✔️	✔️

---

工具库

---

taro-iconfont-cli

在 Taro 框架中使用 iconfont 图标，不依赖字体，支持多色彩。

@fwh1990 出品。【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️

---

长列表方案

React

Taro 框架长列表方案 ：集成下拉刷新、骨架屏、无限滚动、图片懒加载。

@Rahim-Chan 出品。【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️				✔️

---

tarojs-router-next

Taro 小程序路由库/自动生成带参数类型提示的路由方法/允许传递任意类型、任意大小的参数数据/同步的路由方法调用/koa 体验一致的路由中间件。

@lblblong 出品。【物料详情】【Github】

---

vue-taro-router

Vue

基于 Taro，扩展成 vue-router 的使用体验。支持路由拦截、事件回调、链式调用。方法类型有：push、replace、goBack 等。

@kaeryehaowan 出品。【物料详情】【Github】

---

Easy Taro Router

React & Vue

使用过 umi 框架的人，一定对它的约定式路由印象深刻。通过一系列配置，可以让你在 Taro 小程序中实现类似“约定式路由”的功能。

@LuckyHH 出品。【物料详情】【Github】

---

PreQuest

一款好用的小程序请求库。

@xdoer 出品。【物料详情】【Github】

---

taro-storage

扩展 taro 的存储，支持本地存储设置有效期，支持清除过期的本地存储。

@JosnLee 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️

---

百度语音

React

非常轻便的语音合成接口，一般用于对推送过来的消息进行语音播报。

【物料详情】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️	✔️

---

taro-hooks

React

为 Taro 而设计的 Hooks Library。

@innocces 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️				✔️	✔️

---

其它

---

表单可视化编辑

React

使用 Taro3 开发的可视化表单编辑器，支持 H5、小程序（开发中）、app（开发中），可以将其集成在自己的前端项目用于表单构建，或者继承到后端用户表单编辑 在线预览：https://form.t.platelet.xyz/。

@ShaoGongBra 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️	✔️

---

taro-mobx-logger

React

让使用 Taro + Mobx 开发微信小程序获得更友好的状态调试。

@kevin-zeus 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️	✔️	✔️	✔️

---

@better-mini/logger

React

小程序真机调试/预览 Logger 组件，支持输出日志到屏幕进行查看，提升调试效率。 目前仅微信和支付宝端经过完整测试，其他端不一定支持。

@Fay98de 出品。【物料详情】【Github】

	微信	阿里系	百度	头条	H5	RN
支持度	✔️	✔️

---