Tailwind 3.0 默认主题颜色

Question

在尝试更新 PHP 版本时，我想出了一些奇怪的节点问题。我遇到了一些奇怪的 Tailwind 3.0 编译问题，其中并非所有颜色阴影都出现了。默认主题颜色未正确编译。我在 tailwind-config.js 中有颜色，但并非所有色调都像蓝色的 700 那样出现。我注意到如果我将我想要的颜色放入数组中（在所附示例中查看灰色），它会起作用。我必须添加每种颜色吗？这突然开始发生了。 PHP 更新前还好。我正在尝试使用 text-blue-700 但找不到它。

设置示例：https://play.tailwindcss.com/HSzmza7os3?file=config

之前有没有其他人遇到过 defaultTheme 无法引入所有主题颜色阴影的问题？

Answer 1

如果您尝试向现有主题添加变体，则不必使用 defaultTheme。相反，您可以将颜色添加到配置对象的 extend 部分。例如，要保留默认的 Tailwind 类，如 text-gray-500 并添加新的：

module.exports = {
  plugins: [],
  theme: {
    extend: {
      colors: {
        gray: {
          lightest: '#F7F7F7',
          lighter: '#f1f1f1',
          light: '#e1e1e1',
          default: '#57677A',
          dark: '#C2CAD3',
          darker: '#656565',
          darkest: '#808080',
        },
      },
    },
  },
}

如果您只想使用默认颜色（不添加），则不必向配置添加任何内容。

您的示例的工作版本：https://play.tailwindcss.com/rKi0lRmivh

Tailwind 3.0 默认主题颜色

Tailwind 3.0 defaultTheme colors

tailwind-css