css - 如何在配置中使用 theme() 函数（顺风）

Question

我正在尝试创建 1 个可重复使用的间隙变量，我可以在任何有多个按钮的地方使用它。而不是使用gap-3我只想使用gap-buttons

module.exports = {
  theme: {
    extend: {
      gap: {
        buttons: theme(theme.gap.3),
      },
    },
  },
};

我得到的错误是Maximum call stack size exceeded. 我试过buttons: (theme) => theme(theme.gap.3)也没有用。还有颜色，它不起作用......

module.exports = {
  theme: {
    extend: {
      colors: {
       alert: theme => theme('colors.red')
      }
    },
  },
};

score 0 · Accepted Answer

我的一个项目中确实有这种代码，不确定它是否有帮助（那个是tailwind v1，没有extend）

borderColor: (theme) => ({
  ...theme('colors'),
  default: theme('colors.gray.300', 'currentColor'),
}),

你的代码看起来像这样

colors: (theme) => ({
  alert: theme('colors.red')
})

1 回答 1