I'm using the jsx component and the PostCSS plugin postcss-mobile-forever to do the style conversion. The plugin keeps the original style and generates the new media query style, I expect both the original style and the media query style's selector to be correctly converted to CSS Modules, but in fact, only the original style is correctly converted, and the new media query style's selector still has the original selector name. I was expecting both the original style and the media query style selector to be converted to CSS Modules correctly, but in fact only the original style was converted correctly, and the new media query style selector was generated with the same name(Translation by DeepL).
The image below shows that the original .jsx is converted to ._jsx_ckbbb_1, while the one generated by the plugin and in the media query is not converted and remains as .jsx(Translation by DeepL):
At the same time I tested the SFC component, the SFC component can be converted normally, the original style selector name and the style selector name of the media query generated by the plugin are the same, the following picture shows the style selector name of the SFC component(Translation by DeepL):
[X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
[X] Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
Related plugins
[ ] plugin-vue
[x] plugin-vue-jsx
Describe the bug
I'm using the jsx component and the PostCSS plugin postcss-mobile-forever to do the style conversion. The plugin keeps the original style and generates the new media query style, I expect both the original style and the media query style's selector to be correctly converted to CSS Modules, but in fact, only the original style is correctly converted, and the new media query style's selector still has the original selector name. I was expecting both the original style and the media query style selector to be converted to CSS Modules correctly, but in fact only the original style was converted correctly, and the new media query style selector was generated with the same name(Translation by DeepL).
中文
我使用 jsx 组件,同时用 [postcss-mobile-forever](https://github.com/wswmsword/postcss-mobile-forever) 这个 PostCSS 插件做样式的转换,这个插件会保留原有的样式,同时生成新的媒体查询样式,我期望原有样式和媒体查询样式的选择器都正确地被转为 CSS Modules 的形式,但实际上只有原有样式被正确转换,新生成的媒体查询样式的选择器还是原来的选择器名称。The image below shows that the original
.jsx
is converted to._jsx_ckbbb_1
, while the one generated by the plugin and in the media query is not converted and remains as.jsx
(Translation by DeepL):中文
下图展示了原有的 `.jsx` 转为了 `._jsx_ckbbb_1`,而插件生成的、在媒体查询里的没有被转换,仍然是 `.jsx`:At the same time I tested the SFC component, the SFC component can be converted normally, the original style selector name and the style selector name of the media query generated by the plugin are the same, the following picture shows the style selector name of the SFC component(Translation by DeepL):
中文
同时我测试了 SFC 组件,SFC 组件能够正常转换,原有样式的选择器名称和插件生成的媒体查询的样式选择器名称一致,下面的图片展示了 SFC 组件的样式选择器的名称情况:Reproduction
https://github.com/wswmsword/postcss-mobile-forever/tree/main/example/others/vite-vue-jsx
Steps to reproduce
System Info
Used Package Manager
npm
Logs
No response
Validations