Current Behavior

When Angular components reference assets in their stylesheets using url() (e.g., background-image: url('../assets/test-pattern.svg')), the Nx Angular Rspack plugin processes the CSS but fails to extract and copy the referenced asset files to the output directory. This results in:

1. CSS is processed and may be rewritten to reference output paths (e.g., url('./media/test-pattern.svg'))
2. The actual asset files are never copied to the output directory
3. Browser shows 404 errors for missing asset files when the application runs
4. No media directory is created in the build output

Expected Behavior

• Asset files referenced in component stylesheets should be extracted and copied to the output directory
• CSS URLs should be rewritten to point to the copied assets
• No 404 errors should occur for asset files
• A media directory should be created in the output with the extracted assets

GitHub Repo

https://github.com/miluoshi/angular-rspack-repro

Steps to Reproduce

1. Create a new Nx workspace with Angular Rspack:

npx create-nx-workspace@latest repro --preset=angular-standalone --bundler=rspack --style=css --unitTestRunner=jest --e2eTestRunner=playwright --ssr=false --interactive=false
cd repro

2. Create an asset file:

mkdir -p src/assets
# Create src/assets/test-pattern.svg (any SVG/image file)

3. Add CSS rule in component stylesheet (src/app/app.css):

.pattern-background {
  background-image: url('../assets/test-pattern.svg');
  /* other styles... */
}

4. Build the application:

npx nx build

5. Check output directory:

ls -la dist/repro/browser/
ls -la dist/repro/browser/media/  # Should exist but doesn't

Quick reproduction steps:

git clone https://github.com/miluoshi/angular-rspack-repro.git
cd angular-rspack-repro
npm install
npx nx build
ls -la dist/repro/browser/media/  # Expected: media directory with test-pattern.svg, Actual: directory doesn't exist

Environment

Nx Report

NX   Report complete - copy this into the issue template

Node           : 22.16.0
OS             : darwin-arm64
Native Target  : aarch64-macos
npm            : 10.9.2

nx (global)            : 21.3.11
nx                     : 21.4.0
@nx/js                 : 21.4.0
@nx/jest               : 21.4.0
@nx/eslint             : 21.4.0
@nx/workspace          : 21.4.0
@nx/angular            : 21.4.0
@nx/devkit             : 21.4.0
@nx/eslint-plugin      : 21.4.0
@nx/module-federation  : 21.4.0
@nx/rspack             : 21.4.0
@nx/web                : 21.4.0
@nx/webpack            : 21.4.0
typescript             : 5.8.3
---------------------------------------
Registered Plugins:
@nx/angular/plugin
@nx/eslint/plugin
@nx/jest/plugin
@nx/rspack/plugin
---------------------------------------

Failure Logs

# Relevant source files
https://github.com/nrwl/nx/blob/master/packages/angular-rspack-compiler/src/compilation/setup-compilation.ts
https://github.com/nrwl/nx/blob/master/packages/angular-rspack-compiler/src/compilation/setup-with-angular-compilation.ts
https://github.com/nrwl/nx/blob/master/packages/angular-rspack/src/lib/plugins/angular-rspack-plugin.ts

Package Manager Version

No response

Operating System

• macOS
• Linux
• Windows
• Other (Please specify)

Additional Information

The issue appears to be in the Nx Angular Rspack compilation process where the ComponentStylesheetBundler from Angular's build system correctly processes assets and generates outputFiles, but these files are never emitted using compilation.emitAsset() in the Rspack plugin.

Technical details:

• The bug occurs in the interaction between Angular's ComponentStylesheetBundler and the Nx Angular Rspack plugin
• ComponentStylesheetBundler.bundleFile() and ComponentStylesheetBundler.bundleInline() return outputFiles containing asset data
• These outputFiles are currently ignored and never processed by the Rspack build pipeline
• Assets need to be emitted using compilation.emitAsset() during the build process

Files likely involved:

• @nx/angular-rspack-compiler/dist/compilation/setup-compilation.js
• @nx/angular-rspack-compiler/dist/compilation/setup-with-angular-compilation.js
• @nx/angular-rspack/dist/lib/plugins/angular-rspack-plugin.js