[Bug]: Unicode escape sequences in styled-components are inconsistent between development and production environments

[wendy0512]

Version

System:
    OS: Windows 10 10.0.19042
    CPU: (12) x64 11th Gen Intel(R) Core(TM) i5-11500 @ 2.70GHz
    Memory: 15.19 GB / 31.71 GB
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (127.0.2651.74)  
    Internet Explorer: 11.0.19041.1566
  npmPackages:
    @rsbuild/core: ^1.1.0 => 1.1.3 
    @rsbuild/plugin-less: ^1.1.0 => 1.1.0 
    @rsbuild/plugin-react: ^1.0.7 => 1.0.7 
    @rsbuild/plugin-styled-components: ^1.1.0 => 1.1.0

Details

In a project configured with rsbuild, CSS styles defined via styled-components fail to handle Unicode escape sequences (e.g., \e67f) consistently between the development and production environments.

Observed behavior:

• Defined: content: "\e67f";

  • Development environment: The sequence is incorrectly parsed as content: "e67f"; (escape sequence is lost).

  • Production environment: The sequence is correctly parsed as content: "\e67f"; (expected behavior).

• When defined as the complete Unicode code point (e.g., content: "\ue67f";):

  • Development environment: Displays correctly.

  • Production environment: Displays incorrectly.

• When defined in a LESS file as content: "\e67f:

  • Both development and production environments parse and display the style correctly.

Reproduce link

https://github.com/wendy0512/rsbuild-unicode-repro

Reproduce Steps

1.npm i
2.npm run start
3.npm run build

[chenjiahan]

This might be a bug of @swc/plugin-styled-component, @GiveMe-A-Name can you help to confirm this? ❤️