跳到主要内容

简介

总览

由于小程序运行时,本身有自己的一套 独特的 技术规范标准。这导致你无法使用 web 开发中的很多的特性,

你也无法 直接 使用像 tailwindcss 这种原子化 css 生成器来提升你的开发效率。

weapp-tailwindcss 就能让你,在小程序开发中使用 tailwindcss 大部分 特性。

它支持目前上所有使用 webpackvite 的主流多端小程序框架和使用 webpack / gulp 的原生小程序打包方式。

你可以很容易在各个框架,或原生开发中集成 tailwindcss

现在,就让我们开始使用吧!

信息

从本质上讲,它是一个字符串转义器。它负责把 tailwindcss 中,所采集的类名,以及生成的结果,转化成小程序中可以接受的方式。

Why weapp-tailwindcss?

  • ✅ 自动处理所有文件:以微信小程序为例,不但可以处理和转义 wxml / wxss,还能处理 jswxs 产物
  • ✅ 支持最原生的小程序开发,也支持许多框架如 taro , uni-app , mpx , rax 等等..
  • ✅ 提供多种使用方式,方便项目集成:包括 webpack / vite / gulp 插件和直接的 nodejs api
  • ✅ 生态好,解决方案丰富,提供大量现成模板,可以利用许多 tailwindcss 现有的生态来构建小程序。
  • ✅ 高效的解析和缓存机制,热更新响应时间快
  • ✅ 贴合 tailwindcss 的设计思路,智能提示友好

快速开始 🚀

weapp-tailwindcss 主要提供了 3 种使用方式:

👉 1. 框架类( taro , uni-app , mpx )小程序开发的快速开始

👉 2. 原生小程序开发的快速开始

👉 3. 可直接使用的各个框架的小程序模板

演示视频

另外特别感谢 舜岳同学weapp-tailwindcss 制作的视频