Skip to content

兼容小程序中 TailwindCSS 或 UnoCSS 等原子化 css 类名语法不支持的转换

License

Notifications You must be signed in to change notification settings

Simon-He95/unplugin-atomize-css-uni

Repository files navigation

unplugin-atomize-css-uni

此插件为了解决 uniapp 中使用 TailwindCSSUnoCSS,遇到原子化 css 语法编译到微信小程序 wxss,不支持\[\]#:%的问题,会将这些不能被 wxss 识别的 class 转换成以下的形式

🌈 Options

  • 可以传入Options去覆盖原本的class名,或增加新的不能被识别需要被转换的符号

🧰 使用

import { vitePlugin as vitePluginAtomizeCssUni } from 'unplugin-atomize-css-uni'
plugins:[
  vitePluginAtomizeCssUni(options)
]

⚠️ 注意

  • 只针对.vue文件和.css文件做转换
const tailwindMap: Record<string, string> = {
  '[': '__brackets__',
  ']': '__brackets__',
  '!': '__important__',
  ':': '__colon__',
  '%': '__percent__',
  '#': '__idSelector__',
}

License

MIT License © 2022 Simon He

Buy Me A Coffee

sponsors

About

兼容小程序中 TailwindCSS 或 UnoCSS 等原子化 css 类名语法不支持的转换

Topics

Resources

License

Stars

Watchers

Forks

Packages