Hello,

(I'm on Windows)

In this issue, I've manually installed sass-loader (https://github.com/Coly010/ng-rspack-build/issues/9) + "fixed" paths in project.json just in case (https://github.com/Coly010/ng-rspack-build/issues/8).

When trying to serve the generated application, I'm getting a compilation error.

It somehow seems that it is not recognizing the decorator @Component.

> nx run rspack-angular:serve:development

<i> [webpack-dev-server] Project is running at:
<i> [webpack-dev-server] Loopback: http://localhost:4200/
<i> [webpack-dev-server] On Your Network (IPv4): http://192.168.1.103:4200/
<i> [webpack-dev-server] On Your Network (IPv6): http://[fe80::94c:4501:73f2:5ba6]:4200/
<i> [webpack-dev-server] Content not from webpack is served from 'E:\Git\nx-rspack-angular\public' directory
<i> [webpack-dev-server] 404s will fallback to '/index.html'
Compilation failed. See above for more details.
assets by chunk 3.7 MiB (name: main)
  asset main.js 3.7 MiB [emitted] [javascript module] (name: main)
  asset main.css 236 bytes [emitted] (name: main)
asset favicon.ico 14.7 KiB [emitted]
asset index.html 402 bytes [emitted]
Entrypoint main 3.7 MiB = main.js 3.7 MiB main.css 236 bytes
orphan modules 228 KiB [orphan] 148 modules
runtime modules 33.5 KiB 19 modules
cacheable modules 3.41 MiB (javascript) 79 bytes (css)
  modules by path ../../node_modules/.pnpm/rxjs@7.8.1/node_modules/rxjs/dist/esm/internal/ 109 KiB 78 modules
  modules by path ../../node_modules/.pnpm/webpack-dev-server@5.0.4_webpack@5.95.0_@swc+core@1.7.26_@swc+helpers@0.5.13__/node_modules/webpack-dev-server/client/ 74.2 KiB 14 modules
  modules by path ./src/ 613 bytes (javascript) 79 bytes (css) 5 modules
  modules by path ../../node_modules/.pnpm/@rspack+core@1.0.7_@swc+helpers@0.5.13/node_modules/@rspack/core/hot/*.js 6.19 KiB 4 modules
  modules by path ../../node_modules/.pnpm/html-entities@2.5.2/node_modules/html-entities/lib/*.js 140 KiB 4 modules
  modules by path ../../node_modules/.pnpm/@rspack+dev-server@1.0.7_@rspack+core@1.0.7_@swc+helpers@0.5.13__@types+express@4.17.21_webpa_ptiohfocirqrxntc3nrwsqmgdm/node_modules/@rspack/dev-server/ 21.5 KiB 3 modules
  modules by path ../../node_modules/.pnpm/@angular+core@18.2.6_rxjs@7.8.1_zone.js@0.14.10/node_modules/@angular/core/fesm2022/ 1.85 MiB 3 modules
  modules by path ../../node_modules/.pnpm/@angular+common@18.2.6_@angular+core@18.2.6_rxjs@7.8.1_zone.js@0.14.10__rxjs@7.8.1/node_modules/@angular/common/fesm2022/*.mjs 549 KiB       
    ../../node_modules/.pnpm/@angular+common@18.2.6_@angular+core@18.2.6_rxjs@7.8.1_zone.js@0.14.10__rxjs@7.8.1/node_modules/@angular/common/fesm2022/common.mjs 375 KiB [built] [code generated]
    ../../node_modules/.pnpm/@angular+common@18.2.6_@angular+core@18.2.6_rxjs@7.8.1_zone.js@0.14.10__rxjs@7.8.1/node_modules/@angular/common/fesm2022/http.mjs 174 KiB [built] [code generated]
  + 4 modules
ERROR in ./src\app\app.component.ts
  × Module build failed:
  ├─▶   ×   x Expression expected
  │     │    ,-[/Git\nx-rspack-angular\apps\rspack-angular\src\app\app.component.ts:5:1]
  │     │  2 | import { RouterModule } from '@angular/router';
  │     │  3 | import { NxWelcomeComponent } from './nx-welcome.component';
  │     │  4 |
  │     │  5 | @Component({
  │     │    : ^
  │     │  6 |   standalone: true,
  │     │  7 |   imports: [NxWelcomeComponent, RouterModule],
  │     │  8 |   selector: 'app-root',
  │     │    `----
  │     │
  │
  ╰─▶ Syntax Error
 @ ./src\main.ts
Rspack 1.0.7 compiled with 1 error in 2.97 s
Compilation failed. See above for more details.
assets by status 638 bytes [cached] 2 assets
assets by status 3.71 MiB [emitted]
  assets by chunk 3.7 MiB (name: main)
    asset main.js 3.7 MiB [emitted] [javascript module] (name: main)
    asset main.ae923b376934210c81f5.hot-update.mjs 208 bytes [emitted] [javascript module] [hmr] (name: main)
  asset favicon.ico 14.7 KiB [emitted]
  asset main.ae923b376934210c81f5.hot-update.json 28 bytes [emitted] [hmr]
Entrypoint main 3.7 MiB = main.js 3.7 MiB main.ae923b376934210c81f5.hot-update.mjs 208 bytes main.css 236 bytes
cached modules 228 KiB [cached] 148 modules
runtime modules 33.5 KiB 19 modules
cacheable modules 3.41 MiB (javascript) 79 bytes (css)
  modules by path ../../node_modules/.pnpm/rxjs@7.8.1/node_modules/rxjs/dist/esm/internal/ 109 KiB 78 modules
  modules by path ../../node_modules/.pnpm/webpack-dev-server@5.0.4_webpack@5.95.0_@swc+core@1.7.26_@swc+helpers@0.5.13__/node_modules/webpack-dev-server/client/ 74.2 KiB 14 modules   
  modules by path ./src/ 613 bytes (javascript) 79 bytes (css) 5 modules
  modules by path ../../node_modules/.pnpm/@rspack+core@1.0.7_@swc+helpers@0.5.13/node_modules/@rspack/core/hot/*.js 6.19 KiB 4 modules
  modules by path ../../node_modules/.pnpm/html-entities@2.5.2/node_modules/html-entities/lib/*.js 140 KiB 4 modules
  modules by path ../../node_modules/.pnpm/@rspack+dev-server@1.0.7_@rspack+core@1.0.7_@swc+helpers@0.5.13__@types+express@4.17.21_webpa_ptiohfocirqrxntc3nrwsqmgdm/node_modules/@rspack/dev-server/ 21.5 KiB 3 modules
  modules by path ../../node_modules/.pnpm/@angular+core@18.2.6_rxjs@7.8.1_zone.js@0.14.10/node_modules/@angular/core/fesm2022/ 1.85 MiB 3 modules
  modules by path ../../node_modules/.pnpm/@angular+common@18.2.6_@angular+core@18.2.6_rxjs@7.8.1_zone.js@0.14.10__rxjs@7.8.1/node_modules/@angular/common/fesm2022/*.mjs 549 KiB       
    ../../node_modules/.pnpm/@angular+common@18.2.6_@angular+core@18.2.6_rxjs@7.8.1_zone.js@0.14.10__rxjs@7.8.1/node_modules/@angular/common/fesm2022/common.mjs 375 KiB [code generated]
    ../../node_modules/.pnpm/@angular+common@18.2.6_@angular+core@18.2.6_rxjs@7.8.1_zone.js@0.14.10__rxjs@7.8.1/node_modules/@angular/common/fesm2022/http.mjs 174 KiB [code generated] 
  + 4 modules
ERROR in ./src\app\app.component.ts
  × Module build failed:
  ├─▶   ×   x Expression expected
  │     │    ,-[/Git\nx-rspack-angular\apps\rspack-angular\src\app\app.component.ts:5:1]
  │     │  2 | import { RouterModule } from '@angular/router';
  │     │  3 | import { NxWelcomeComponent } from './nx-welcome.component';
  │     │  4 |
  │     │  5 | @Component({
  │     │    : ^
  │     │  6 |   standalone: true,
  │     │  7 |   imports: [NxWelcomeComponent, RouterModule],
  │     │  8 |   selector: 'app-root',
  │     │    `----
  │     │
  │
  ╰─▶ Syntax Error
 @ ./src\main.ts
Rspack 1.0.7 compiled with 1 error in 110 ms

Reproduction

https://github.com/Yberion/nx-rspack-angular/tree/feat/rspack-app-compile-error

corepack enable
corepack prepare pnpm@latest --activate
pnpm install --no-frozen-lockfile
Serve with the console or pnpm exec nx run rspack-angular:serve --configuration=development

Env

Angular CLI: 18.2.6
Node: 20.17.0
Package Manager: pnpm 9.11.0
OS: win32 x64

Angular: 18.2.6
... animations, build, cdk, cli, common, compiler, compiler-cli
... core, forms, language-service, material, platform-browser
... platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1802.6
@angular-devkit/build-angular   18.2.6
@angular-devkit/core            18.2.6
@angular-devkit/schematics      18.2.6
@schematics/angular             18.2.6
ng-packagr                      18.2.1
rxjs                            7.8.1
typescript                      5.5.4

Hello,

I've tested with npm , I'm getting the same error.

> nx run rspack-angular:serve:development

<i> [webpack-dev-server] Project is running at:
<i> [webpack-dev-server] Loopback: http://localhost:4200/
<i> [webpack-dev-server] On Your Network (IPv4): http://192.168.1.103:4200/
<i> [webpack-dev-server] On Your Network (IPv6): http://[fe80::94c:4501:73f2:5ba6]:4200/
<i> [webpack-dev-server] Content not from webpack is served from 'E:\Git\nx-rspack-angular\public' directory
<i> [webpack-dev-server] 404s will fallback to '/index.html'
Compilation failed. See above for more details.
assets by chunk 3.68 MiB (name: main)
  asset main.js 3.68 MiB [emitted] [javascript module] (name: main)
  asset main.css 236 bytes [emitted] (name: main)
asset favicon.ico 14.7 KiB [emitted]
asset index.html 402 bytes [emitted]
Entrypoint main 3.68 MiB = main.js 3.68 MiB main.css 236 bytes
orphan modules 228 KiB [orphan] 148 modules
runtime modules 33.5 KiB 19 modules
cacheable modules 3.41 MiB (javascript) 79 bytes (css)
  modules by path ./../../node_modules/ 3.18 MiB
    modules by path ./../../node_modules/rxjs/dist/esm/internal/ 109 KiB 78 modules
    modules by path ./../../node_modules/@angular/ 2.9 MiB 7 modules
    + 2 modules
  modules by path ../../node_modules/ 242 KiB
    modules by path ../../node_modules/webpack-dev-server/client/ 74.2 KiB 14 modules
    modules by path ../../node_modules/@rspack/ 27.7 KiB 7 modules
    modules by path ../../node_modules/html-entities/lib/*.js 140 KiB 4 modules
  modules by path ./src/ 613 bytes (javascript) 79 bytes (css)
    modules by path ./src/app/*.ts 346 bytes 3 modules
    ./src\styles.scss 79 bytes [built] [code generated]
    ./src\main.ts 267 bytes [built] [code generated]
ERROR in ./src\app\app.component.ts
  × Module build failed:
  ├─▶   ×   x Expression expected
  │     │    ,-[/Git\nx-rspack-angular\apps\rspack-angular\src\app\app.component.ts:5:1]
  │     │  2 | import { RouterModule } from '@angular/router';
  │     │  3 | import { NxWelcomeComponent } from './nx-welcome.component';
  │     │  4 |
  │     │  5 | @Component({
  │     │    : ^
  │     │  6 |   standalone: true,
  │     │  7 |   imports: [NxWelcomeComponent, RouterModule],
  │     │  8 |   selector: 'app-root',
  │     │    `----
  │     │
  │
  ╰─▶ Syntax Error
 @ ./src\main.ts
Rspack 1.0.7 compiled with 1 error in 3.02 s
Compilation failed. See above for more details.
assets by status 638 bytes [cached] 2 assets
assets by status 3.7 MiB [emitted]
  assets by chunk 3.68 MiB (name: main)
    asset main.js 3.68 MiB [emitted] [javascript module] (name: main)
    asset main.6720ef516bdb52a171ea.hot-update.mjs 208 bytes [emitted] [javascript module] [hmr] (name: main)
  asset favicon.ico 14.7 KiB [emitted]
  asset main.6720ef516bdb52a171ea.hot-update.json 28 bytes [emitted] [hmr]
Entrypoint main 3.68 MiB = main.js 3.68 MiB main.6720ef516bdb52a171ea.hot-update.mjs 208 bytes main.css 236 bytes
cached modules 228 KiB [cached] 148 modules
runtime modules 33.5 KiB 19 modules
cacheable modules 3.41 MiB (javascript) 79 bytes (css)
  modules by path ./../../node_modules/ 3.18 MiB
    modules by path ./../../node_modules/rxjs/dist/esm/internal/ 109 KiB 78 modules
    modules by path ./../../node_modules/@angular/ 2.9 MiB 7 modules
    + 2 modules
  modules by path ../../node_modules/ 242 KiB
    modules by path ../../node_modules/webpack-dev-server/client/ 74.2 KiB 14 modules
    modules by path ../../node_modules/@rspack/ 27.7 KiB 7 modules
    modules by path ../../node_modules/html-entities/lib/*.js 140 KiB 4 modules
  modules by path ./src/ 613 bytes (javascript) 79 bytes (css)
    modules by path ./src/app/*.ts 346 bytes 3 modules
    ./src\main.ts 267 bytes [code generated]
    ./src\styles.scss 79 bytes [code generated]
ERROR in ./src\app\app.component.ts
  × Module build failed:
  ├─▶   ×   x Expression expected
  │     │    ,-[/Git\nx-rspack-angular\apps\rspack-angular\src\app\app.component.ts:5:1]
  │     │  2 | import { RouterModule } from '@angular/router';
  │     │  3 | import { NxWelcomeComponent } from './nx-welcome.component';
  │     │  4 |
  │     │  5 | @Component({
  │     │    : ^
  │     │  6 |   standalone: true,
  │     │  7 |   imports: [NxWelcomeComponent, RouterModule],
  │     │  8 |   selector: 'app-root',
  │     │    `----
  │     │
  │
  ╰─▶ Syntax Error
 @ ./src\main.ts
Rspack 1.0.7 compiled with 1 error in 116 ms

Coly010 / ng-rspack-build

[Bug] Compilation failed #10

Reproduction

Env