Skip to content

[Bug]: plugin-sass fails to correctly follow @forward directive #3932

Open
@jowen

Description

@jowen

Version

System:
    OS: macOS 14.3
    CPU: (12) arm64 Apple M3 Pro
    Memory: 121.75 MB / 18.00 GB
    Shell: 5.9 - /bin/zsh
  Browsers:
    Chrome: 130.0.6723.117
    Safari: 17.3
  npmPackages:
    @rsbuild/core: ^1.0.19 => 1.1.0 
    @rsbuild/plugin-react: ^1.0.6 => 1.0.7 
    @rsbuild/plugin-sass: ^1.1.0 => 1.1.0

Details

Build fails with error when trying to import @carbon/react styles.

× Module build failed:
╰─▶ × expected "{".
│ ╷
│ 1 │ 'use strict';
│ │ ^
│ ╵
│ ../../../@carbon/colors/lib/index.js 1:13 @forward
│ ../../../@carbon/styles/scss/\_colors.scss 8:1 @forward
│ ../../../@carbon/styles/index.scss 10:1 @use
│ ../../../../src/index.scss 1:1 root stylesheet

This is because rsbuild tries to load @carbon/colors/lib/index.js instead of @carbon/colors/index.scss when trying to follow @forward @carbon/colors

This works correctly on webpack and next.js

Reproduce link

https://github.com/jowen/rsbuild-carbon

Reproduce Steps

npm i
npm run dev

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions