-
Notifications
You must be signed in to change notification settings - Fork 4.4k
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
Ensure @config
is injected in common ancestor sheet
#14989
Conversation
9491340
to
207183b
Compare
plugins: [ | ||
() => { | ||
// custom stuff which is too complicated to migrate to CSS | ||
}, | ||
], |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
plugins: [ | |
() => { | |
// custom stuff which is too complicated to migrate to CSS | |
}, | |
], | |
theme: { | |
extend: { | |
colors: { | |
'my-red': 'red', | |
}, | |
}, | |
}, |
When we update the config to something that we can convert to, we noticed that the @theme
now ends up in src/index.css
and that the @config
is still inside src/tailwind-setup.css
.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Once we found a common parent between two sheets, we can stop finding the parent and continue to the next sheets.
207183b
to
36bceb0
Compare
We already computed the correct Tailwind root file (and linked the JS config to it). This means that we can remove the logic in the migrate-config migration to find the correct location.
This PR fixes an issue where an
@config
was injected in a strange location if you have multiple CSS files with Tailwind directives.Let's say you have this setup:
In this case,
base.css
,components.css
, andutilities.css
are all considered Tailwind roots because they contain Tailwind directives or imports.Since there are multiple roots, the nearest common ancestor should become the tailwind root (where
@config
is injected). In this case, the nearest common ancestor istailwind-setup.css
(notindex.css
because that's further away).Before this change, we find the common ancestor between
base.css
andcomponents.css
which would beindex.css
instead oftailwind-setup.css
.In a next iteration, we compare
index.css
withutilities.css
and find that there is no common ancestor (because theindex.css
file has no parents). This resulted in the@config
being injected inindex.css
and inutilities.css
.Continuing with the rest of the migrations, we migrate the
index.css
's@config
away, but we didn't migrate the@config
fromutilities.css
.With this PR, we don't even have the
@config
in theutilities.css
file anymore.Test plan
@config
is injected in the correct file.@config
does not exist in theutilities.css
file (this was the first bug we solved)@config
is replaced in thetailwind.css
file correctly.