build: remove Sourcemaps from Schematics bundles (#57545)

alan-agius4 · alxhub · commit b74b5f0c0605 · 2024-08-27T13:27:33.000-07:00
This commit reduces the bundle size of `@angular/core` by 19.5 MB by excluding sourcemaps from the schematics. Since the `esbuild` rule doesn't allow disabling sourcemaps directly, we work around this by setting the sourcemaps to `external`. Afterward, we filter the output to include only the `.js` files. PR Close #57545
diff --git a/packages/core/schematics/migrations/after-render-phase/BUILD.bazel b/packages/core/schematics/migrations/after-render-phase/BUILD.bazel
@@ -1,4 +1,4 @@
-load("//tools:defaults.bzl", "esbuild", "ts_library")
+load("//tools:defaults.bzl", "esbuild_no_sourcemaps", "ts_library")
 
 package(
     default_visibility = [
@@ -20,7 +20,7 @@ ts_library(
     ],
 )
 
-esbuild(
+esbuild_no_sourcemaps(
     name = "bundle",
     entry_point = ":index.ts",
     external = [
diff --git a/packages/core/schematics/migrations/http-providers/BUILD.bazel b/packages/core/schematics/migrations/http-providers/BUILD.bazel
@@ -1,4 +1,4 @@
-load("//tools:defaults.bzl", "esbuild", "ts_library")
+load("//tools:defaults.bzl", "esbuild_no_sourcemaps", "ts_library")
 
 package(
     default_visibility = [
@@ -20,7 +20,7 @@ ts_library(
     ],
 )
 
-esbuild(
+esbuild_no_sourcemaps(
     name = "bundle",
     entry_point = ":index.ts",
     external = [
diff --git a/packages/core/schematics/migrations/invalid-two-way-bindings/BUILD.bazel b/packages/core/schematics/migrations/invalid-two-way-bindings/BUILD.bazel
@@ -1,4 +1,4 @@
-load("//tools:defaults.bzl", "esbuild", "ts_library")
+load("//tools:defaults.bzl", "esbuild_no_sourcemaps", "ts_library")
 
 package(
     default_visibility = [
@@ -21,7 +21,7 @@ ts_library(
     ],
 )
 
-esbuild(
+esbuild_no_sourcemaps(
     name = "bundle",
     entry_point = ":index.ts",
     external = [
diff --git a/packages/core/schematics/ng-generate/control-flow-migration/BUILD.bazel b/packages/core/schematics/ng-generate/control-flow-migration/BUILD.bazel
@@ -1,4 +1,4 @@
-load("//tools:defaults.bzl", "esbuild", "ts_library")
+load("//tools:defaults.bzl", "esbuild_no_sourcemaps", "ts_library")
 
 package(
     default_visibility = [
@@ -26,7 +26,7 @@ ts_library(
     ],
 )
 
-esbuild(
+esbuild_no_sourcemaps(
     name = "bundle",
     entry_point = ":index.ts",
     external = [
diff --git a/packages/core/schematics/ng-generate/inject-migration/BUILD.bazel b/packages/core/schematics/ng-generate/inject-migration/BUILD.bazel
@@ -1,4 +1,4 @@
-load("//tools:defaults.bzl", "esbuild", "ts_library")
+load("//tools:defaults.bzl", "esbuild_no_sourcemaps", "ts_library")
 
 package(
     default_visibility = [
@@ -25,7 +25,7 @@ ts_library(
     ],
 )
 
-esbuild(
+esbuild_no_sourcemaps(
     name = "bundle",
     entry_point = ":index.ts",
     external = [
diff --git a/packages/core/schematics/ng-generate/route-lazy-loading/BUILD.bazel b/packages/core/schematics/ng-generate/route-lazy-loading/BUILD.bazel
@@ -1,4 +1,4 @@
-load("//tools:defaults.bzl", "esbuild", "ts_library")
+load("//tools:defaults.bzl", "esbuild_no_sourcemaps", "ts_library")
 
 package(
     default_visibility = [
@@ -27,7 +27,7 @@ ts_library(
     ],
 )
 
-esbuild(
+esbuild_no_sourcemaps(
     name = "bundle",
     entry_point = ":index.ts",
     external = [
diff --git a/packages/core/schematics/ng-generate/standalone-migration/BUILD.bazel b/packages/core/schematics/ng-generate/standalone-migration/BUILD.bazel
@@ -1,4 +1,4 @@
-load("//tools:defaults.bzl", "esbuild", "ts_library")
+load("//tools:defaults.bzl", "esbuild_no_sourcemaps", "ts_library")
 
 package(
     default_visibility = [
@@ -27,7 +27,7 @@ ts_library(
     ],
 )
 
-esbuild(
+esbuild_no_sourcemaps(
     name = "bundle",
     entry_point = ":index.ts",
     external = [
diff --git a/tools/defaults.bzl b/tools/defaults.bzl
@@ -10,6 +10,7 @@ load("@npm//@bazel/protractor:index.bzl", _protractor_web_test_suite = "protract
 load("@npm//typescript:index.bzl", "tsc")
 load("@npm//@angular/build-tooling/bazel/app-bundling:index.bzl", _app_bundle = "app_bundle")
 load("@npm//@angular/build-tooling/bazel/http-server:index.bzl", _http_server = "http_server")
+load("@npm//@angular/build-tooling/bazel:filter_outputs.bzl", "filter_outputs")
 load("@npm//@angular/build-tooling/bazel/karma:index.bzl", _karma_web_test = "karma_web_test", _karma_web_test_suite = "karma_web_test_suite")
 load("@npm//@angular/build-tooling/bazel/api-golden:index.bzl", _api_golden_test = "api_golden_test", _api_golden_test_npm_package = "api_golden_test_npm_package")
 load("@npm//@angular/build-tooling/bazel:extract_js_module_output.bzl", "extract_js_module_output")
@@ -650,6 +651,24 @@ def esbuild(args = None, **kwargs):
         **kwargs
     )
 
+def esbuild_no_sourcemaps(name, **kwargs):
+    esbuild_target_name = "%s.with-sourcemap" % name
+
+    # Unlike linked, when using external the .js output file does not contain a //# sourceMappingURL= comment.
+    # See: https://esbuild.github.io/api/#sourcemap
+    esbuild(
+        name = esbuild_target_name,
+        sourcemap = "external",
+        output = "%s.js" % name,
+        **kwargs
+    )
+
+    filter_outputs(
+        name = name,
+        target = esbuild_target_name,
+        filters = ["%s.js" % name],
+    )
+
 def esbuild_checked_in(name, **kwargs):
     esbuild_esm_bundle(
         name = "%s_generated" % name,
