使用 TailwindCSS 清除 CSS 白名单模式

Question

我试图在通过 PurgeCSS 处理时保留所有 TailwindCSS 颜色类（即 bg-green、bg-red、text-green、text-red）。这些颜色类是在 CMS 中设置的，而不是在代码中设置的，因此我们无法搜索它们的代码，因为它们（全部）不存在于此处。

因此，我想使用PurgeCSS的白名单功能来保留所有以 'bg-' 或 'text-' 开头的类。但是，我下面的模式似乎并没有奏效？任何想法如何调整它？

whitelistPatterns: ['^bg\-', '^text\-'],

Answer 1

如果您运行较新版本的 tailwind：whitelist和whitelistPatterns合并到safelist中。这个信息花了我一天的时间进行研究。

purge: {
  options: {
    safelist: ["bg-red-50"],
  },
  // ... or even
  options: {
    safelist: [/^bg-/, /^text-/]
  },

}

Answer 2

问题似乎只是使用正则表达式，而不是字符串。

whitelistPatterns: [/^bg-/, /^text-/], // Retain all classes starting with...