search

web-infra-dev / rsbuild

The Rspack-based build tool. It's fast, out-of-the-box and extensible.
https://rsbuild.dev/
MIT License
1.81k stars 140 forks source link

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

Open jowen opened 5 days ago

jowen commented 5 days ago

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

inottn commented 5 days ago

I haven't looked into it closely, but it might be the same as this issue (https://github.com/web-infra-dev/rspack/issues/8057#issuecomment-2397398311).