Tailwind CSS V3.1.6 safelist patterns配置失效问题求助

你当前的safelist配置无效，原因是同一个JavaScript对象里重复定义了pattern键——对象中重复的键会被最后一个值覆盖，所以实际上只有/border-/这个正则规则在生效，bg-和text-的规则根本没起作用。

正确配置方式 #

有两种写法可以实现需求：

写法一：拆分多个规则对象

safelist: [
  { pattern: /bg-/ },
  { pattern: /text-/ },
  { pattern: /border-/ },
]

写法二：合并正则表达式（更简洁）

把三个前缀合并到一个正则里，匹配所有以bg-、text-、border-开头的类：

safelist: [
  { pattern: /^(bg-|text-|border-)/ },
]

配置修改后，Tailwind会保留所有符合这些前缀的工具类，解决之前的失效问题。

内容的提问来源于stack exchange，提问作者dungey_140