小编Min*_*med的帖子

Gatsby 动态样式在生产版本中不起作用

我是 Gatsby 的新手,我正在使用 tailwind css 和 postcss。我在 tailwind.config.js 主题对象中定义的一些颜色配置在开发环境中有效,但在生产中无效。我尝试过清理缓存并删除公用文件夹并重新构建它。那并没有解决问题。我在 tailwind.config.js 中的主题对象是这样的:

theme: {
    colors: {
      transparent: 'transparent',
      current: 'currentColor',
      primary: {
        DEFAULT: '#4F9C3A',
        900: '#25441c',
      },
      secondary: {
        0: '#ff9563',
        DEFAULT: '#E66437',
        9: '#ae3409',
      },
      footer: {
        light: '#e66437',
        DEFAULT: '#383e42',
        dark: '#26292c',
      },
      neutral: {
        0: '#ffffff',
        DEFAULT: '#ffffff',
        1: '#fafafa',
        9: '#000000',
      },
      accent: {
        1: '#388ac5',
        DEFAULT: '#293842',
      },
      brown: {
        DEFAULT: '#C9AC75',
        2: '#44261c',
      },
      black: '#000000',
    }
}
Run Code Online (Sandbox Code Playgroud)

更新:我已经能够查明问题的根源。我正在使用 gatsby-transformer-json 从 json 文件中获取要应用的类名。我有类似下面的代码段来设置背景颜色,它在开发环境中工作,但在生产环境中不起作用。

<div …
Run Code Online (Sandbox Code Playgroud)

gatsby tailwind-css

5
推荐指数
1
解决办法
2809
查看次数

标签 统计

gatsby ×1

tailwind-css ×1