generating colors as an object of functions

[kouji-dev]

I have a file called colors.js which has the following

this is the generated file with postcsss command: npm run build

It has js inside it, but when using a different config like this:

it works perfectly and the generated CSS file doesn't have any js inside

What version of Tailwind CSS are you using?

tailwindcss: 2.2.15
postcss: 8.3.8
postcss-import: 14.0.2
postcss-nested: 5.0.6
postcss-cli: 9.0.0
autoprefixer: 10.3.5
cssnano: 5.0.8

node: v16.6.0

operating system: Windows

example: https://github.com/goodbeysr/colors-config

[adamwathan]

Hey! I think there is probably some subtle bug in the way you have this set up that isn't quite assigning things the values you want. If you can provide an actual minimal reproduction (a GitHub repo with just the bare minimum code to demonstrate this not working) it'll be easier for someone to help point out the change that needs to be made.

[kouji-dev]

@adamwathan any chance? this is really weird, I followed exactly what's in the docs

[crswll]

Not sure if this helps at all but it's working here: https://play.tailwindcss.com/be4arOmJvP?file=config

[kouji-dev]

@crswll it is working live, but did you check my repo ? i would love to generate css file for that tailwindcss config you did, therefore im using an npm run build command, and the output is wrong

[crswll]

The issue seems to be a bug with defining corePlugins.

https://play.tailwindcss.com/gABJC0VwII?file=config

If you uncomment the corePlugins line in the play above it stops working.

[crswll]

Ok, it's not a bug because you can do corePlugins: ['textColor', 'textOpacity'] and it'll work just fine. You'll just need to add all the right *Opacity plugins to the corePlugins list.

[crswll]

The issue here is that you need to also list the plugins that allows the plugin to have opacity.

You would need to do:

corePlugins: [
  'textColor',
  'textOpacity',
  'backgroundColor',
  'backgroundOpacity',
  ...
],

The list at the bottom here should be really helpful: https://tailwindcss.com/docs/configuration#core-plugins