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

Resolve imports from CSS file #15010

Merged
merged 8 commits into from
Nov 15, 2024
Merged

Resolve imports from CSS file #15010

merged 8 commits into from
Nov 15, 2024

Conversation

RobinMalfait
Copy link
Member

@RobinMalfait RobinMalfait commented Nov 15, 2024

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 imports other.css. Another leave-me-alone.css is created to proof that this file is not changed. Running the upgrade guide using index.css also migrates other.css but not leave-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

@RobinMalfait RobinMalfait force-pushed the feat/resolve-import-tree branch 3 times, most recently from 8c4fd84 to 691b093 Compare November 15, 2024 17:00
@RobinMalfait RobinMalfait force-pushed the feat/resolve-import-tree branch from 58ac51a to ecca617 Compare November 15, 2024 17:51
Comment on lines 92 to 93
// We don't want to process ignored files (like node_modules)
if (isIgnored(file)) continue
Copy link
Member Author

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.

@RobinMalfait RobinMalfait marked this pull request as ready for review November 15, 2024 18:56
@RobinMalfait RobinMalfait requested a review from a team as a code owner November 15, 2024 18:56
//
// 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 })
Copy link
Contributor

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?

Copy link
Contributor

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?

Copy link
Member Author

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)
Copy link
Contributor

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

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yep exactly.

@RobinMalfait RobinMalfait merged commit 57f87be into next Nov 15, 2024
1 check passed
@RobinMalfait RobinMalfait deleted the feat/resolve-import-tree branch November 15, 2024 21:06
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.

2 participants