hub / github.com/sonofmagic/weapp-tailwindcss
github.com/sonofmagic/weapp-tailwindcss @1.0.1 sqlite
7,333 symbols
24,029 edges
2,111 files
27 documented · 0%
README
weapp-tailwindcss
Bring Tailwind CSS to mini programs and multi-platform apps.
简体中文 | English
What It Is
weapp-tailwindcss adapts Tailwind CSS for mini program ecosystems. It transforms Tailwind-generated selectors, utility classes, and selected CSS capabilities into forms that mini programs and multi-platform frameworks can consume more reliably.
It is designed for:
- Using Tailwind CSS in WeChat, Alipay, Douyin, and other mini program environments.
- Sharing atomic CSS conventions across
uni-app/uni-app x, Taro, Mpx, native mini programs, weapp-vite, and related stacks. - Handling mini program class escaping, selector compatibility, rpx arbitrary values, CSS fallbacks, and H5/Web output differences in Tailwind CSS v4 projects.
- Building multi-platform apps that target mini programs, H5/Web, and App WebViews.
Current Support
| Area | Support |
|---|---|
| Tailwind CSS | Tailwind CSS v4 |
| Build tools | Vite, Webpack 5, Rspack, Rollup, Rolldown, Gulp, and Node API |
| Frameworks | uni-app / uni-app x, Taro, Mpx, native mini programs, weapp-vite, and related integrations |
| Output targets | Mini programs, H5/Web, App WebView, and related platform differences |
| Runtime ecosystem | merge, variants, cva, runtime, typography, theme-transition, ui, and related packages |
| Node.js | Node.js ^20.19.0 or >=22.12.0 |
Documentation
- Official website
- Quick start
- Tailwind CSS v4 setup
- Framework integration
- uni-app x guide
- Multi-platform guide
- Configuration reference
- FAQ
- Mirror documentation
Core Packages
| Package | Purpose |
|---|---|
weapp-tailwindcss |
Core transform and bundler integration entry |
@weapp-tailwindcss/postcss |
CSS AST processing, selector compatibility, and platform fallbacks |
@weapp-tailwindcss/postcss-calc |
Safe reduction for calc() expressions |
@weapp-tailwindcss/reset |
Reset stylesheet assets for mini program frameworks |
tailwindcss-config |
Tailwind CSS config loading |
tailwindcss-injector |
Tailwind directive injection and WXML dependency tracking |
weapp-style-injector |
Style entry injection for mini program build artifacts |
Runtime And UI Ecosystem
| Package | Purpose |
|---|---|
@weapp-tailwindcss/runtime |
Shared runtime layer for escape/unescape, caching, and rpx transforms |
@weapp-tailwindcss/merge |
Mini program runtime wrapper for Tailwind Merge v3 |
@weapp-tailwindcss/variants |
Mini program runtime wrapper for tailwind-variants |
@weapp-tailwindcss/cva |
Mini program runtime wrapper for class-variance-authority |
@weapp-tailwindcss/typography |
Mini program adapted version of Tailwind Typography |
theme-transition |
Theme transition runtime and Tailwind plugin |
@weapp-tailwindcss/ui |
Atomic UI runtime layer for mini programs |
Each package now uses Chinese as its default README.md and provides an English README.en.md.
AI Skill
If you want AI to integrate weapp-tailwindcss in an application project using current best practices, install the official Skill:
npx skills add sonofmagic/skills --skill weapp-tailwindcss
It is useful for:
- Setting up
uni-app/uni-app x, Taro, or native mini program projects. - Choosing the right Tailwind CSS v4 configuration path.
- Troubleshooting missing classes, rpx arbitrary values, JS string classes, and
space-x/space-ybehavior. - Producing integration steps with validation and rollback guidance.
Read more in the Skill documentation.
Contributing
Issues and pull requests are welcome:
- Report reproducible problems.
- Improve framework examples or documentation.
- Improve transforms, compatibility behavior, runtime packages, or test coverage.
Before contributing, read the repository AGENTS.md and the closest AGENTS.md under the target directory.
License
Star History
Extension points exported contracts — how you extend this code
IBaseWebpackPlugin (Interface)(no doc) [1 implementers]
packages/weapp-tailwindcss/src/types/index.ts
WebpackObjectPluginInstance (Interface)
(no doc) [1 implementers]
packages/weapp-style-injector/src/webpack.ts
BenchCliOptions (Interface)
(no doc)
tools/weapp-tailwindcss-scripts/src/vite-dev-hmr-bench.ts
CreateContextOptions (Interface)
(no doc)
packages/init/src/index.ts
PostCssCalcOptions (Interface)
(no doc)
packages/postcss-calc/src/index.ts
PipelineNodeCursor (Interface)
(no doc)
packages/postcss/src/pipeline.ts
NormalizedResetRule (Interface)
(no doc)
packages/reset/src/normalize.ts
LoadWetwConfigOptions (Interface)
(no doc)
packages/wetw/src/config.ts
Core symbols most depended-on inside this repo
pushcalled by 1602
packages/weapp-tailwindcss/src/js/JsTokenUpdater.ts
map
called by 1248
packages/weapp-tailwindcss/src/js/JsTokenUpdater.ts
filter
called by 763
packages/weapp-tailwindcss/src/js/JsTokenUpdater.ts
toString
called by 627
packages/weapp-tailwindcss/test/bundlers/webpack.v5.unit/shared.ts
writeFile
called by 490
packages/weapp-tailwindcss/test/util.ts
em
called by 382
packages-runtime/typography/src/styles.js
createRollupAsset
called by 309
packages/weapp-tailwindcss/test/bundlers/vite-plugin.testkit.ts
getCompilerContext
called by 257
packages/weapp-tailwindcss/src/context/index.ts
Shape
Languages
TypeScript100%
Python1%
Modules by API surface
packages/weapp-tailwindcss/test/fixtures/js/taro-lottie-miniprogram-build-no-compress.js164 symbols
packages/weapp-tailwindcss/test/fixtures/js/taro-lottie-miniprogram-build.js161 symbols
packages/weapp-tailwindcss/src/bundlers/vite/processed-css-assets.ts76 symbols
packages/weapp-tailwindcss/src/bundlers/vite/index.ts65 symbols
website/scripts/generate-api-docs.ts63 symbols
packages/weapp-tailwindcss/src/bundlers/webpack/BaseUnifiedPlugin/v5-assets/pipeline-helpers.ts57 symbols
scripts/local-full-platform-report.ts50 symbols
e2e/watch/hot-update/shared.ts50 symbols
e2e/snapshotUtils.ts50 symbols
e2e/apps-generator-mode-compare.test.ts48 symbols
tools/weapp-tailwindcss-scripts/src/watch-hmr-regression/types.ts46 symbols
tools/weapp-tailwindcss-scripts/src/vite-dev-hmr-bench.ts43 symbols
Dependencies from manifests, versioned
@ampproject/remapping2.3.0 · 1×
@babel/corecatalog:babelCore728 · 1×
@babel/generator7.29.7 · 1×
@babel/helper-plugin-utils7.29.7 · 1×
@babel/parser7.29.7 · 1×
@babel/plugin-proposal-class-properties7.18.6 · 1×
@babel/plugin-proposal-decorators7.29.7 · 1×
@babel/plugin-syntax-typescript7.29.7 · 1×
@babel/plugin-transform-class-properties7.29.7 · 1×
@babel/plugin-transform-runtime7.28.3 · 1×
@babel/preset-env7.28.3 · 1×
@babel/preset-react7.29.7 · 1×
For agents
$ claude mcp add weapp-tailwindcss \
-- python -m otcore.mcp_server <graph>