Issue with scss imports in npm workspaces

[Nevinia210]

Hello everyone,
recently I started to work with updating Lerna from version 3.22.1 to 8.1.2 in our solution. In Lerna documentation I read that I should use package manager workspaces (npm in my case).

First I tried it with some "blank" solution and even there I'm still facing issues with imports in scss file:
file path: Monorepo.Poc/Solution1/src/helloWorld/components/HelloWorls.module.scss
error:

Error - sass - src\webparts\helloWorld\components\HelloWorld.module.scss(1,9): error Error: Can't find stylesheet to import.
  ╷
1 │ @import '~@fluentui/react/dist/sass/References.scss';
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  src\webparts\helloWorld\components\HelloWorld.module.scss 1:9  root stylesheet
Error - 'sass' sub task errored after 167 ms 
 Can't find stylesheet to import.
  ╷
1 │ @import '~@fluentui/react/dist/sass/References.scss';
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  src\webparts\helloWorld\components\HelloWorld.module.scss 1:9  root stylesheet

Is there some way how gulp could be configured to work with npm workspaces?
Thanks for your answers in advance

Expected Behavior

Solution will build without errors:

• import of @import '~@fluentui/react/dist/sass/References.scss'; will work

Steps To Reproduce

1. Create project folder (Monorepo.Poc)
2. Create solution folder (Solution1)
3. Generate spfx webpart solution in folder Solution1 (with yo @microsoft/sharepoint cmd)

• What is your solution name? (solution-1) - press enter

• Which type of client-side component to create? (Use arrow keys) - select WebPart and press enter

WebPart
Extension
Library
Adaptive Card Extension

• What is your Web part name? (HelloWorld) - press enter

• Which template would you like to use? - select React and press enter

Minimal
No framework
React

4. In parent folder (Monorepo.Poc) create package.json file with content:

{
  "name": "my-workspaces-powered-project",
  "workspaces": [
    "Solution1"
  ]
}

5. run cmd npm install in folder Monorepo.Poc
6. run cmd npm run build --workspaces in folder Monorepo.Poc

Environment

• npm: 9.6.7
• Node.js: v18.17.1
• Spfx: 1.18.2
• gulp: 4.0.2
• OS Name: Windows 10
• npm config:

; "user" config from C:\Users\xx\.npmrc

https-proxy = "http://185.155.56.70:65432"
proxy = "http://185.155.56.70:65432"
strict-ssl = false

; node bin location = C:\Program Files\nodejs\node.exe
; node version = v18.17.1
; npm local prefix = C:\Users\xx\source\repos\Monorepo.Poc
; npm version = 9.6.7
; cwd = C:\Users\xx\source\repos\Monorepo.Poc
; HOME = C:\Users\xx
; Run `npm config ls -l` to show all defaults.

gulpfile.js

'use strict';

var gulp = require('gulp'); 

const build = require('@microsoft/sp-build-web');

var sass = require('gulp-sass');

gulp.task('sass', function () {
  return gulp.src('sass/*.scss')
    .pipe(sass().on('error', sass.logError))
    .pipe(gulp.dest('css'));
});

build.addSuppression(`Warning - [sass] The local CSS class 'ms-Grid' is not camelCase and will not be type-safe.`);

var getTasks = build.rig.getTasks;
build.rig.getTasks = function () {
  var result = getTasks.call(build.rig);

  result.set('serve', result.get('serve-deprecated'));

  return result;
};

build.initialize(require('gulp'));