Skip to content

[Bug]: (plugin-vue) CSS modules ID mismatch between web and node targets #5519

@escaton

Description

@escaton

Version

System:
  OS: macOS 15.5
  CPU: (14) arm64 Apple M4 Pro
  Memory: 192.58 MB / 24.00 GB
  Shell: 5.9 - /bin/zsh
Browsers:
  Chrome: 138.0.7204.92
  Safari: 18.5
npmPackages:
  @rsbuild/core: ^1.4.3 => 1.4.3 
  @rsbuild/plugin-vue: ^1.1.0 => 1.1.0

Details

Continuation of #5505
After updating to v1.1.0, the css modules maps are now emitted in node target, but they are different from the ones generated for web.

server.js:

;// CONCATENATED MODULE: ./src/layouts/ModernLayout.vue.css?vue&type=style&index=0&id=676cf0e6&module=true&lang=css!=!./node_modules/@rsbuild/core/dist/ignoreCssLoader.mjs!./node_modules/@rsbuild/core/compiled/css-loader/index.js??clonedRuleSet-2.use[1]!./node_modules/vue-loader/dist/stylePostLoader.js!./node_modules/vue-loader/dist/index.js??ruleSet[0].use[0]!./src/layouts/ModernLayout.vue?vue&type=style&index=0&id=676cf0e6&module=true&lang=css
// Exports
/* ESM default export */ const ModernLayoutvue_type_style_index_0_id_676cf0e6_module_true_lang_css = ({
	"container": `container-yQOyGh`,
	"rightArea": `rightArea-eFvl4n`,
	"grid": `grid-EgLeCK`,
	"desktop_header": `desktop_header-AhmSWU`,
	"desktopHeader": `desktop_header-AhmSWU`,
	"mobile_header": `mobile_header-U41QPE`,
	"mobileHeader": `mobile_header-U41QPE`,
	"left": `left-zAaxHz`,
	"right": `right-wW2Omi`,
	"main": `main-Yuga3C`,
	"footer": `footer-CPDZPO`,
	"right_wrapper": `right_wrapper-y7NcDB`,
	"rightWrapper": `right_wrapper-y7NcDB`
});

client.js (inlined):

$style = {
    container: 'container-xe4Cld',
    rightArea: 'rightArea-Jm23CS',
    grid: 'grid-E3jSt7',
    desktop_header: 'desktop_header-X6Te3q',
    desktopHeader: 'desktop_header-X6Te3q',
    mobile_header: 'mobile_header-Kniz0r',
    mobileHeader: 'mobile_header-Kniz0r',
    left: 'left-MeXskC',
    right: 'right-RLDIdw',
    main: 'main-AkY9Vl',
    footer: 'footer-reRk86',
    right_wrapper: 'right_wrapper-kZVD1w',
    rightWrapper: 'right_wrapper-kZVD1w',
}

Reproduce link

Reproduce Steps

same as in #5505

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions