From 50c783307eb1253f4f2a87502bd7a19f6a409aeb Mon Sep 17 00:00:00 2001
From: Charles Lyding <19598772+clydin@users.noreply.github.com>
Date: Wed, 10 Aug 2022 21:47:11 -0400
Subject: [PATCH] fix(@angular-devkit/build-angular): use valid CSS comment for
 sourcemaps with Sass in esbuild builder

CSS does not support the single line JS comment (`//`) but rather only the multi-line comment (`/* */`).
When generating the sourcemap URL comment with the modern Sass API, the multi-line comment syntax will
now be used. This removes the esbuild warnings per Sass file that would have otherwise been generated
when stylesheet sourcemaps are enabled for the build.
---
 .../build_angular/src/builders/browser-esbuild/sass-plugin.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/angular_devkit/build_angular/src/builders/browser-esbuild/sass-plugin.ts b/packages/angular_devkit/build_angular/src/builders/browser-esbuild/sass-plugin.ts
index c0c0a4304f83..a6238493f827 100644
--- a/packages/angular_devkit/build_angular/src/builders/browser-esbuild/sass-plugin.ts
+++ b/packages/angular_devkit/build_angular/src/builders/browser-esbuild/sass-plugin.ts
@@ -42,7 +42,7 @@ export function createSassPlugin(options: { sourcemap: boolean; loadPaths?: stri
 
           return {
             loader: 'css',
-            contents: css + sourceMapToUrlComment(sourceMap),
+            contents: `${css}\n${sourceMapToUrlComment(sourceMap)}`,
             watchFiles: loadedUrls.map((url) => fileURLToPath(url)),
             warnings,
           };
@@ -75,5 +75,5 @@ function sourceMapToUrlComment(sourceMap: CompileResult['sourceMap']): string {
 
   const urlSourceMap = Buffer.from(JSON.stringify(sourceMap), 'utf-8').toString('base64');
 
-  return `//# sourceMappingURL=data:application/json;charset=utf-8;base64,${urlSourceMap}`;
+  return `/*# sourceMappingURL=data:application/json;charset=utf-8;base64,${urlSourceMap} */`;
 }