跳到主要内容
版本:3.x

社区优质物料

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

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

如何贡献

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

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

模板项目


网易云音乐小程序

React

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

@lsqy 出品。【Github

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

nice-router-taro

React

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

@kala888 出品。【Github

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

小溪里博客小程序

React

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

@shenghanqin 出品。【Github

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

房贷计算器

React

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

58 同城团队出品。【Github

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

《瑞克和莫蒂》Wiki

React

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

@ 出品。【Github

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

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

React

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

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

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

微信小程序每日工作量

Vue

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

@whyour 出品。【Github

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

niceup

React

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

@nasawz 出品。【Github

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

taro-mall

React

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

@jiechud 出品。【Github

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

Vue3 + TS 快速开发模板

Vue3

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

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

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

React + Dva + Less 模板

React

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

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

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

elf-taro

React

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

@didilinkin 出品。【Github

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

taro-kit

React

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

@wsdo 出品。【Github

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

样式库

NutUI

Vue3

支持多端开发的 Vue 组件库

@jdf2e 出品。【官网】【Github

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

taro-ui-vue

Vue

Taro UI 的 Vue 实现。

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

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

taro-ui-vue3

Vue3

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

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

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

Taroify

React

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

@tangzhi 出品。【物料详情】【Gitee

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

taro-color-ui

React

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

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

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

@antmjs/vantui

React

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

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

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

Tard

React

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

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

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

插件


编译提速插件

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

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

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

骨架屏插件

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

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

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

tailwindcss 插件

Taro 接入 tailwindcss 2.0 插件。

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

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

动态加载代码插件

React

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

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

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

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

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

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

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

兼容 wsl 插件

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

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

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

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

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

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

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

组件


虚拟列表

React

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

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

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

商品双向联动列表

React

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

物料详情

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

下拉式筛选菜单

React

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

物料详情

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

抽奖插件

React & Vue

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

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

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

日历热力图

React

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

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

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

弧形进度条

React

弧形进度条,单个模板。

物料详情

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

手写签名

React

Taro 的手写签名库。

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

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

日期时间选择组件

React

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

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

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

wPicker

React

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

物料详情

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

时间选择器

React

时间选择器。

物料详情

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

日期选择器

Vue

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

物料详情

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

多功能表格组件

React

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

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

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

echarts-taro3-react

React

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

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

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

echarts-taro3-vue

Vue

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

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

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

taro3-react-f2

React

Taro3 集成图表库 f2。

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

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

taro-vchart

React

Taro3 集成图表库 @visactor/vchart。

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

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

工具库


taro-iconfont-cli

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

@fwh1990 出品。【Github

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

长列表方案

React

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

@Rahim-Chan 出品。【Github

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

tarojs-router-next

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

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


vue-taro-router

Vue

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

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


Easy Taro Router

React & Vue

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

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


PreQuest

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

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


taro-storage

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

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

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

百度语音

React

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

物料详情

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

taro-hooks

React

为 Taro 而设计的 Hooks Library。

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

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

其它


表单可视化编辑

React

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

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

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

taro-mobx-logger

React

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

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

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

@better-mini/logger

React

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

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

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