perf(@angular-devkit/build-angular): with esbuild builder only load Sass compiler when needed

clydin · dgp1130 · commit 87a61aac362e · 2022-08-23T12:31:52.000-07:00
Previously, the Sass compiler was imported on the start of every build regardless of its usage.
The Sass compiler will now only be loaded if a Sass stylesheet is requested.
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
@@ -16,12 +16,10 @@ export function createSassPlugin(options: { sourcemap: boolean; loadPaths?: stri
     setup(build: PluginBuild): void {
       let sass: typeof import('sass');
 
-      build.onStart(async () => {
-        // Lazily load Sass
-        sass = await import('sass');
-      });
+      build.onLoad({ filter: /\.s[ac]ss$/ }, async (args) => {
+        // Lazily load Sass when a Sass file is found
+        sass ??= await import('sass');
 
-      build.onLoad({ filter: /\.s[ac]ss$/ }, (args) => {
         try {
           const warnings: PartialMessage[] = [];
           // Use sync version as async version is slower.
