跳到主要内容
Tailwind CSS website mode

weapp-tailwindcss

AtomGit G-Star 毕业项目认证徽章

让 Tailwind CSS 稳定跑在小程序里。

对齐 Tailwind CSS 的主流写法,同时接管 Web 与小程序目标的生成、转义与运行时边界。

Web小程序AndroidiOSHarmonyOS
generatortarget: web | weapp
Tailwind CSS 入口入口

@import "tailwindcss" + @source@import + @source

classNameSet 精确命中命中

从真实源码收集候选类名只转已生成类名

Web / Weapp 同源输出输出

按目标生成 CSSWeb 与小程序分端

输出稳定 CSS + 精确类名转义
TailwindCSS-first / config
框架Taro / uni-app / 原生
构建器Webpack / Vite / Gulp
运行时merge / variants / cva

守住工程边界,接管生成与转译

复用 Tailwind 输入,把源码扫描、样式生成、类名转义和运行时工具放在一条工程链路里。

构建器接管 Tailwind 生成

Webpack、Vite、Gulp 与自定义 Node 流程都由 weapp-tailwindcss 接管输出,不在小程序构建里叠加官方 Tailwind 生成插件。

精确转译

JS 与模板只转换 Tailwind 命中类名,避免业务字符串被误伤。

Tailwind 多模式并行

新项目使用 CSS-first,存量项目继续保留稳定接入路径。

跨生态落地

覆盖 Taro、uni-app、原生小程序以及 Webpack、Vite、Gulp 链路。

运行时工具族

merge、variants、cva 在小程序端保持转义前后一致。

同一套 Tailwind 输入,按目标端交付产物

Web 保持 Tailwind 原生语义;小程序补齐选择器、单位、转义与运行时边界。团队统一入口,再按框架接入。

查看配置项
快速开始按 Tailwind 版本与构建器选择接入路线。CSS-first 接入查看 CSS-first 入口、source 与生成模式。配置项类型、插件与配置项的完整参考。AI / llms让模型读取精简索引,减少过期配置。社区加入交流群,反馈真实框架问题。