Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add @config support #9405

Merged
merged 3 commits into from
Sep 23, 2022
Merged

Add @config support #9405

merged 3 commits into from
Sep 23, 2022

Conversation

thecrypticace
Copy link
Contributor

@thecrypticace thecrypticace commented Sep 23, 2022

The new @config rule lets you specify a config file relative to your CSS. This, additionally, lets you have multiple config files for separate CSS entry points — oftentimes found in monorepos with multiple packages.

This means that you can now do this and it will look for the config file next to the CSS file:

@config "./tailwind.config.js";
@tailwind base;
@tailwind components;
@tailwind utilities;

This even works with postcss-import if you have a @config directive in an imported file. In which case the config will be relative to that imported CSS file. If you do not have an @config directive we will still use the config file specified by the postcss plugin for that CSS file.

Warning
This does not work the way you may expect with imports + preprocessors like Sass/LESS/etc… as those generally compile to one blob of CSS that's passed to PostCSS so it will likely be relative to the Sass entry file instead.

Fixes #6517

Co-Authored-By: Robin Malfait <malfait.robin@gmail.com>
@thecrypticace thecrypticace merged commit 5ea752e into master Sep 23, 2022
@thecrypticace thecrypticace deleted the feature/refactor-cli branch September 23, 2022 17:48
deathaxe added a commit to SublimeText/TailwindCSS that referenced this pull request Oct 22, 2022
This commit adds support for @config introduced with Tailwind 3.2

see: tailwindlabs/tailwindcss#9405
deathaxe added a commit to SublimeText/TailwindCSS that referenced this pull request Oct 22, 2022
This commit adds support for @config introduced with Tailwind 3.2

see: tailwindlabs/tailwindcss#9405
@JamieGarcia123
Copy link

JamieGarcia123 commented Oct 27, 2022

So would this be ideal if we have monorepo for mulitple clients but need different style sheets based on that company? for instance the color themes will be different from client to client

@zommerberg
Copy link

zommerberg commented Oct 27, 2022

So would this be ideal if we have monorepo for mulitple clients but need different style sheets based on that company? for instance the color themes will be different from client to client

I am also interested in that, especially if we dynamically fetch client specific data (fonts/colors) after we have built and deployed the app

@eYinka
Copy link

eYinka commented Nov 11, 2022

So would this be ideal if we have monorepo for mulitple clients but need different style sheets based on that company? for instance the color themes will be different from client to client

I am also interested in that, especially if we dynamically fetch client specific data (fonts/colors) after we have built and deployed the app

This is my use case at the moment. Now I am thinking if it's possible to store the path to each client's custom config in an ENV file and then dynamically load it somehow. Wild thoughts maybe?

Edit:

Another way to look at it is to do it the way it's stated in the official docs and then import the CSS dynamically. Create multiple tailwind configs and multiple CSS files to reference the corresponding configs.

In the app:
if tenant === 'xyz', import xyz-css.css. Javascript dynamic import could work here...

All just in my head for now. Maybe I'd try it and report my findings.

@fabswt
Copy link

fabswt commented May 2, 2024

link to the docs: https://tailwindcss.com/docs/functions-and-directives#config

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Resolve config file relative to the file being transformed instead of cwd
5 participants