feat(css): support css module compose/from path resolution

[kamilic]

Description

Vite don't support path resolving when using compose / from on cssmodule file currently because postcss-modules didn't provide options liked resolve in postcss-import.

And now postcss-modules supported path resolutiion feature on 4.2.2 so that we can implement / fix this feature.

What is the purpose of this pull request?

• Bug fix
• New Feature
• Documentation update
• Other

Before submitting the PR, please make sure you do the following

• Read the Contributing Guidelines.
• Read the Pull Request Guidelines and follow the Commit Convention.
• Check that there isn't already a PR that solves the problem the same way to avoid creating a duplicate.
• Provide a description in this PR that addresses what the PR is solving, or reference the issue that it solves (e.g. fixes #123).
• Ideally, include relevant tests that fail without this PR but pass with it.

[Shinigami92]

Is it possible to add a test case?

As you can see, there is also an error you need to fix:

src/node/plugins/css.ts(670,36): error TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'CSSAtImportResolvers'.

[kamilic]

Is it possible to add a test case?

As you can see, there is also an error you need to fix:

src/node/plugins/css.ts(670,36): error TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'CSSAtImportResolvers'.

ok, I will try to add some test case and fix errors.

[kamilic]

@Shinigami92 I added a .css cssmodule file test case only, but it support sass and less file path resolution actually.
I am not sure what is the best way to write tests in these situations instead of copy the css test case again and again.

[patak-dev]

Thanks for the PR @kamilic. The change looks good to me. About the added test, I think it would be better to add it as an integration test is the css playground. These tests are better for us because we can catch wrong interactions between the diferent pieces. Would you check if it is possible to move it to packages/playground/css?

[kamilic]

Thanks for the PR @kamilic. The change looks good to me. About the added test, I think it would be better to add it as an integration test is the css playground. These tests are better for us because we can catch wrong interactions between the diferent pieces. Would you check if it is possible to move it to packages/playground/css?

I will find time to add some test on playground.

[kamilic]

@patak-js playground tests now added.
And an anothor problem founded. HMR seems not working when I change content of the composed cssmodule file. The composed .module.css file seems not to be considered as a dependency.

I think it should be fixed on other pull requests so I commented out some test code and add a @todo tag.

[patak-dev]

Great! Thanks for taking the time to add the tests.

About the new issue, it would be good to also create a bug report with a that reproduction against the current version so it easier to track it.