diff --git a/packages/angular_devkit/build_angular/src/tools/esbuild/angular/component-stylesheets.ts b/packages/angular_devkit/build_angular/src/tools/esbuild/angular/component-stylesheets.ts
index 213e0cd482cb..2be907f07444 100644
--- a/packages/angular_devkit/build_angular/src/tools/esbuild/angular/component-stylesheets.ts
+++ b/packages/angular_devkit/build_angular/src/tools/esbuild/angular/component-stylesheets.ts
@@ -126,16 +126,21 @@ export class ComponentStylesheetBundler {
       for (const outputFile of result.outputFiles) {
         const filename = path.basename(outputFile.path);
 
-        // Needed for Bazel as otherwise the files will not be written in the correct place.
-        outputFile.path = path.join(this.options.workspaceRoot, outputFile.path);
+        if (outputFile.type === BuildOutputFileType.Media || filename.endsWith('.css.map')) {
+          // The output files could also contain resources (images/fonts/etc.) that were referenced and the map files.
 
-        if (outputFile.type === BuildOutputFileType.Media) {
-          // The output files could also contain resources (images/fonts/etc.) that were referenced
-          outputFiles.push(outputFile);
+          // Clone the output file to avoid amending the original path which would causes problems during rebuild.
+          const clonedOutputFile = outputFile.clone();
+
+          // Needed for Bazel as otherwise the files will not be written in the correct place,
+          // this is because esbuild will resolve the output file from the outdir which is currently set to `workspaceRoot` twice,
+          // once in the stylesheet and the other in the application code bundler.
+          // Ex: `../../../../../app.component.css.map`.
+          clonedOutputFile.path = path.join(this.options.workspaceRoot, outputFile.path);
+
+          outputFiles.push(clonedOutputFile);
         } else if (filename.endsWith('.css')) {
           contents = outputFile.text;
-        } else if (filename.endsWith('.css.map')) {
-          outputFiles.push(outputFile);
         } else {
           throw new Error(
             `Unexpected non CSS/Media file "${filename}" outputted during component stylesheet processing.`,