默认颜色不适用于`tailwind.macro`

Posted 2023-03-07

【中文标题】默认颜色不适用于`tailwind.macro`

【英文标题】：Default colors does not work for `tailwind.macro`

【发布时间】：2020-01-22 14:06:31

【问题描述】：

我有一个 React 应用程序，试图让 tailwind.macro 在其中工作 emotion 符号。 我正在使用customize-cra 重新连接应用程序，$twWHATEVER 正在成功运行。 但是，它似乎并没有继承原来的颜色主题 tailwind 我正在寻找解决方案。 这里是项目：https://github.com/minagawah/cra-ts-emotion-tailwind-solution

如 README 中所述，我尝试过 (1)using babel macro, (2) using PostCSS plugins. 我以为是backgroundSize 问题 正如在 this issue，但没有运气。

这是我在应用程序中使用tw 宏符号的方法：

#./src/App.tsx

import styled from '@emotion/styled';
import tw from 'tailwind.macro';

const Button = styled.button`
  $tw`mt-4 p-2 text-white bg-red-600`
`;

它目前有效 because I applied a workaround 为此。

它应该应用默认的顺风颜色主题，而无需我应用的解决方法。 我一直在想办法，但到目前为止，没有运气......

拜托，我非常需要这方面的帮助......

编辑：(2019-09-22) 当我努力让bg-red 工作时，我发现默认情况下没有bg-red 这样的东西......这是我需要手动添加tailwind.config.js 的东西。

问题已解决。

module.exports = 
  theme: 
    extend: 
      colors: 
        red: '#e53e3e',
      ,
    ,
  ,
  variants: ,
  plugins: [],

【参考方案1】：

  theme: 
    extend: 
      colors: 
        red: '#e53e3e',
      ,
    ,
  ,
  variants: ,
  plugins: [],

【参考方案2】：

我通过从 tailwind.config.js 中的 tailwindcss github 复制默认值解决了相同的问题。 这是tailwindcss默认值的链接 https://github.com/tailwindcss/tailwindcss/blob/master/stubs/defaultConfig.stub.js#L5