Migrate to Angular 15 issue

[fadihanna123]

Which @angular/* package(s) are the source of the bug?

Don't known / other

Is this a regression?

Yes

Description

When i migrated to Angular 15 i got this error always: ./src/styles.scss?ngGlobalStyle:1:0 - Error: Module parse failed: Unexpected token (1:0) File was processed with these loaders:

• ./node_modules/.pnpm/[email protected]/node_modules/resolve-url-loader/index.js
• ./node_modules/.pnpm/[email protected][email protected][email protected]/node_modules/sass-loader/dist/cjs.js You may need an additional loader to handle the result of these loaders.

> * {
|   margin: 0;
|   padding: 0;

It seems that project have problem with Scss files. My Scss file:

* {
  margin: 0;
  padding: 0;
  font-size: 100%;
  box-sizing: border-box;
  border: 0;
  outline: 0;
  list-style: none;
}

body {
  background-color: #121a25;
  color: #fff;
}

Can you please help me solve it or do i need to downgrade to Angular 14?

Please provide a link to a minimal reproduction of the bug

No response

Please provide the exception or error you saw

No response

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 15.0.0
Node: 16.13.0
Package Manger: Pnpm 7.16.1
OS: Windows 11 x64

Angular: 15.0.0
@angular-devkit/build-angular: 15.0.0
rxjs: 7.5.7
typescript: 4.8.2

Anything else?

No response

[alan-agius4]

I'm sorry, but we can't reproduce the problem following the instructions you provided.

Can you setup a minimal repro please?

You can read here why this is needed. A good way to make a minimal repro is to create a new app via ng new repro-app and adding the minimum possible code to show the problem. Then you can push this repository to github and link it here.

This might be related to your directory structure so its really important to get an accurate repro to diagnose this.

[LorinRenodeyn]

I've run into this exact error when using storybook + angular15 with the scss imports in the .storybook/preview.js file. Switching to building storybook via the angular.json using ng run + upgrading to the latest storybook 7 alpha version (^51) solved the issue for me.

[alan-agius4]

This is one of the breaking changes in version 14.

We now issue a build time error since importing a CSS file as an ECMA module is non standard Webpack specific feature, which is not supported by the Angular CLI.

This feature was never truly supported by the Angular CLI, but has as such for visibility.

See https://github.com/angular/angular-cli/releases/tag/14.0.0 for more information about all the breaking changes.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}