tailwindcss 的最佳实践是什么样的

[luob]

tailwind 这个工具看起来很受大家欢迎, 在 V2EX 凡是和 css 沾边的帖子, 不出 5 楼一定有人提 tailwind.

但是我就一直不明白 tailwind 的正确打开方式是什么. 那一串串类名看起来和滥用正则表达式一样不靠谱, 写完了自己回头再捋一遍都费劲. 在 react 中, 如果需要一些动态样式, 还要用 classnames. 有的类名写标签里,有的类名写 classnames 里, 这就更乱了.

我搜索 tailwind 最佳实践, 一大半都是"tailwind 是 css 的最佳实践", "tailwind 是 react 的最佳实践" 这种标题, 剩下的也找不到什么有亮点的使用方式, 基本都是复读一下官方示例就结束了. 如果官方文档和这些文章里介绍的写法就是最佳实践, 那 tailwind 根本不是写 css 的最佳实践: 随便一种 css in js 方案不都比这强吗 ?

所以我就想问一下, 既然这么多人用起来都说好, 你们实际项目中都是怎么用的, 在实际项目中的最佳实践是什么样的, 有没有更深入更完整的教程 ?

[xiayue]

个人感觉啊，tailwind 也可以叫做原子化 css，有点类似于以前的 bootstrap 的类名。使用它的前提是，你得有一套符合自己项目的 UI 设计规范，或者说是 css 规范。后续得根据需求去迭代这套规范。我也只是简单用过，没用在正式项目中使用过。