-
Notifications
You must be signed in to change notification settings - Fork 4.3k
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
Resolve imports from CSS file #15010
Conversation
8c4fd84
to
691b093
Compare
When reading this, it almost looks like you made an error, but that's not the case. We will just find CSS files for you instead.
58ac51a
to
ecca617
Compare
// We don't want to process ignored files (like node_modules) | ||
if (isIgnored(file)) continue |
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.
When you don't pass any files, then we used globby with the gitignore: true
option, so I wanted to add that here as well.
I added an explicitly ignored CSS file to the integration tests to make sure we don't touch it.
// | ||
// We can't use the `sheet.root` directly because this will mutate the | ||
// `sheet.root` | ||
let processed = await postcss().use(atImport()).process(sheet.root.toString(), { from: file }) |
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.
Is there a chance this would fail and we'd want to just skip it? Or should it hard crash or w/e?
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.
Also shouldn't we be able to do some of this stuff in analyze()
instead of using postcss-import or nah?
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.
Oh, hmm, let me try to move it. Might work indeed 🤔
This allows us to use a sync version in places where we can't use async code.
if (sheet.file) { | ||
stylesheetsByFile.set(sheet.file, sheet) | ||
try { | ||
let sheet = Stylesheet.loadSync(file) |
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.
a little sad this isn't async but that's a much larger change
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.
Yep exactly.
This PR adds an improvement to the upgrade tool to make sure that if you pass a single CSS file, that the upgrade tool resolves all the imports in that file and processes them as well.
Test plan:
Created a project where
index.css
importsother.css
. Anotherleave-me-alone.css
is created to proof that this file is not changed. Running the upgrade guide usingindex.css
also migratesother.css
but notleave-me-alone.css
.Here is a video so you don't have to manually create it:
Screen.Recording.2024-11-15.at.21.36.27.mov