fix: reuse the old preprocessor after changing the lang attr

[y1d7ng]

Description

fix #4214

Additional context

In the .vue file, changing the lang attribute of the style tag will not cause the preprocessor to be updated. Instead, it will continue to use the previous preprocessor to compile.

---

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]

question:

"[...] changing the lang attribute of the style tag will not cause the preprocessor to be updated. [...]"

Why should this work? You just shrink the condition from includes to includes + endsWith 🤔
Could you explain what is happening here?

[y1d7ng]

When the lang is changed, the corresponding module will be found through the following line of code, but the url of the module still contains the previous lang. The css plugin will parse the url of this module to select the preprocessor.

vite/packages/plugin-vue/src/handleHotUpdate.ts

Line 91 in b5ab77d

const mod = modules.find((m) => m.url.includes(`type=style&index=${i}`))

After adding endsWith, a new module will be generated with the new lang in the url.

[patak-dev]

@OneNail would it be possible to add a test case for this in the vue playground so we avoid future regressions?

[y1d7ng]

@OneNail would it be possible to add a test case for this in the vue playground so we avoid future regressions?

Ok, I will add the test case later.

[y1d7ng]

@patak-js @Shinigami92
I have added the test case and found that there was no test for stylus lang before, so I merged them together to test.