unibest/docs/base/4-style2.md

关于使用 TailwindCSS

对于 unibest 项目使用 TailwindCSS 的评估如下：

1. 直接使用TailwindCSS的限制：

   • 原生TailwindCSS是为Web设计的，在小程序环境下会有兼容性问题
   • 不支持rpx单位，在小程序适配上有困难
   • 需要额外配置postcss和purgeCSS才能在小程序工作

2. 当前UnoCSS的优势：

   • 您的项目已经配置了unocss-applet，专门为小程序优化
   • 支持rpx单位转换（通过presetRemRpx）
   • 支持小程序属性化写法（transformerAttributify）
   • 体积更小，按需生成样式

3. 替代方案建议：

   • 保持使用UnoCSS，它已经实现了Tailwind的大部分功能
   • 可以通过安装@unocss/preset-wind来获得Tailwind风格的类名：

   pnpm add -D @unocss/preset-wind
   

   然后在uno.config.ts中添加：

   import { presetWind } from '@unocss/preset-wind'
   
   export default defineConfig({
     presets: [
       presetWind(),
       // 其他presets...
     ],
   })
   

4. 结论： 在uni-app项目中，UnoCSS是比原生TailwindCSS更合适的选择，特别是针对小程序开发。通过preset-wind可以获得类似Tailwind的开发体验。