refactor(@angular/build): remove sass worker and fallback to pure-JS sass

packages/angular/build/src/private.ts

@@ -35,7 +35,7 @@ export {
 export type { ExternalResultMetadata } from './tools/esbuild/bundler-execution-result';
 export { emitFilesToDisk } from './tools/esbuild/utils';
 export { transformSupportedBrowsersToTargets } from './tools/esbuild/target';
-export { SassWorkerImplementation } from './tools/sass/sass-worker-implementation';
+export { SassCompiler } from './tools/sass/sass-service';
 
 export { SourceFileCache } from './tools/esbuild/angular/source-file-cache';
 export { Cache } from './tools/esbuild/cache';

packages/angular/build/src/tools/esbuild/stylesheets/sass-language.ts

@@ -10,13 +10,12 @@ import type { OnLoadResult, PartialMessage, PartialNote, ResolveResult } from 'e
 import { dirname, join } from 'node:path';
 import { fileURLToPath, pathToFileURL } from 'node:url';
 import type { CanonicalizeContext, CompileResult, Exception, Syntax } from 'sass-embedded';
-import { useSassWorker } from '../../../utils/environment-options';
-import type { SassServiceImplementation } from '../../sass/sass-service';
+import type { SassCompiler } from '../../sass/sass-service';
 import { MemoryCache } from '../cache';
 import { StylesheetLanguage, StylesheetPluginOptions } from './stylesheet-plugin-factory';
 
-let sassService: SassServiceImplementation | undefined;
-let sassServicePromise: Promise<SassServiceImplementation> | undefined;
+let sassService: SassCompiler | undefined;
+let sassServicePromise: Promise<SassCompiler> | undefined;
 
 function isSassException(error: unknown): error is Exception {
   return !!error && typeof error === 'object' && 'sassMessage' in error;
@@ -81,13 +80,9 @@ async function compileString(
   // Lazily load Sass when a Sass file is found
   if (sassService === undefined) {
     if (sassServicePromise === undefined) {
-      sassServicePromise = useSassWorker
-        ? import('../../sass/sass-worker-implementation').then(
-            (sassService) => new sassService.SassWorkerImplementation(true),
-          )
-        : import('../../sass/sass-async-compiler-implementation').then(
-            (sassService) => new sassService.SassAsyncCompilerImplementation(),
-          );
+      sassServicePromise = import('../../sass/sass-service').then(
+        (sassService) => new sassService.SassCompiler(true),
+      );
     }
     try {
       sassService = await sassServicePromise;

packages/angular/build/src/tools/sass/rebasing-importer.ts

@@ -45,7 +45,9 @@ abstract class UrlRebasingImporter implements Importer<'sync'> {
   constructor(
     private entryDirectory: string,
     private rebaseSourceMaps?: Map<string, DecodedSourceMap>,
-  ) {}
+  ) {
+    this.load = this.load.bind(this);
+  }
 
   abstract canonicalize(url: string, options: { fromImport: boolean }): URL | null;
 
@@ -140,6 +142,7 @@ export class RelativeUrlRebasingImporter extends UrlRebasingImporter {
     rebaseSourceMaps?: Map<string, DecodedSourceMap>,
   ) {
     super(entryDirectory, rebaseSourceMaps);
+    this.canonicalize = this.canonicalize.bind(this);
   }
 
   canonicalize(url: string, options: { fromImport: boolean }): URL | null {
@@ -316,33 +319,6 @@ export class RelativeUrlRebasingImporter extends UrlRebasingImporter {
   }
 }
 
-/**
- * Provides the Sass importer logic to resolve module (npm package) stylesheet imports via both import and
- * use rules and also rebase any `url()` function usage within those stylesheets. The rebasing will ensure that
- * the URLs in the output of the Sass compiler reflect the final filesystem location of the output CSS file.
- */
-export class ModuleUrlRebasingImporter extends RelativeUrlRebasingImporter {
-  constructor(
-    entryDirectory: string,
-    directoryCache: Map<string, DirectoryEntry>,
-    rebaseSourceMaps: Map<string, DecodedSourceMap> | undefined,
-    private finder: (specifier: string, options: CanonicalizeContext) => URL | null,
-  ) {
-    super(entryDirectory, directoryCache, rebaseSourceMaps);
-  }
-
-  override canonicalize(url: string, options: CanonicalizeContext): URL | null {
-    if (url.startsWith('file://')) {
-      return super.canonicalize(url, options);
-    }
-
-    let result = this.finder(url, options);
-    result &&= super.canonicalize(result.href, options);
-
-    return result;
-  }
-}
-
 /**
  * Provides the Sass importer logic to resolve module (npm package) stylesheet imports asynchronously
  * and also rebase any `url()` function usage within those stylesheets.
@@ -364,6 +340,8 @@ export class AsyncModuleUrlRebasingImporter implements Importer<'async'> {
       directoryCache,
       rebaseSourceMaps,
     );
+    this.canonicalize = this.canonicalize.bind(this);
+    this.load = this.load.bind(this);
   }
 
   async canonicalize(url: string, options: CanonicalizeContext): Promise<URL | null> {
@@ -412,16 +390,3 @@ export class LoadPathsUrlRebasingImporter extends RelativeUrlRebasingImporter {
     return result;
   }
 }
-
-/**
- * Workaround for Sass not calling instance methods with `this`.
- * The `canonicalize` and `load` methods will be bound to the class instance.
- * @param importer A Sass importer to bind.
- * @returns The bound Sass importer.
- */
-export function sassBindWorkaround<T extends Importer>(importer: T): T {
-  importer.canonicalize = importer.canonicalize.bind(importer);
-  importer.load = importer.load.bind(importer);
-
-  return importer;
-}