Skip to content

Commit 1518133

Browse files
clydinalan-agius4
authored andcommitted
fix(@angular-devkit/build-angular): use relative sourcemap source paths for Sass in esbuild builder
The Sass preprocessor's modern API will generate absolute file URLs for the `sources` field of generated sourcemaps. These URLs will not be properly processed by esbuild and will not be correctly adjusted to be relative to the workspace root directory for the built application. To correct this behavior, the Sass generated sourcemaps are now adjusted to remove the `file:` protocol prefix and to make each path relative to its input file. This allows esbuild to properly resolve and process the paths.
1 parent 4fcb0a8 commit 1518133

File tree

1 file changed

+13
-3
lines changed
  • packages/angular_devkit/build_angular/src/builders/browser-esbuild

1 file changed

+13
-3
lines changed

packages/angular_devkit/build_angular/src/builders/browser-esbuild/sass-plugin.ts

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,9 @@
77
*/
88

99
import type { PartialMessage, Plugin, PluginBuild } from 'esbuild';
10+
import { dirname, relative } from 'node:path';
11+
import { fileURLToPath } from 'node:url';
1012
import type { CompileResult } from 'sass';
11-
import { fileURLToPath } from 'url';
1213

1314
export function createSassPlugin(options: { sourcemap: boolean; loadPaths?: string[] }): Plugin {
1415
return {
@@ -40,7 +41,9 @@ export function createSassPlugin(options: { sourcemap: boolean; loadPaths?: stri
4041

4142
return {
4243
loader: 'css',
43-
contents: sourceMap ? `${css}\n${sourceMapToUrlComment(sourceMap)}` : css,
44+
contents: sourceMap
45+
? `${css}\n${sourceMapToUrlComment(sourceMap, dirname(args.path))}`
46+
: css,
4447
watchFiles: loadedUrls.map((url) => fileURLToPath(url)),
4548
warnings,
4649
};
@@ -66,7 +69,14 @@ export function createSassPlugin(options: { sourcemap: boolean; loadPaths?: stri
6669
};
6770
}
6871

69-
function sourceMapToUrlComment(sourceMap: Exclude<CompileResult['sourceMap'], undefined>): string {
72+
function sourceMapToUrlComment(
73+
sourceMap: Exclude<CompileResult['sourceMap'], undefined>,
74+
root: string,
75+
): string {
76+
// Remove `file` protocol from all sourcemap sources and adjust to be relative to the input file.
77+
// This allows esbuild to correctly process the paths.
78+
sourceMap.sources = sourceMap.sources.map((source) => relative(root, fileURLToPath(source)));
79+
7080
const urlSourceMap = Buffer.from(JSON.stringify(sourceMap), 'utf-8').toString('base64');
7181

7282
return `/*# sourceMappingURL=data:application/json;charset=utf-8;base64,${urlSourceMap} */`;

0 commit comments

Comments
 (0)