build: make devmode a noop and ensure it never runs (angular#48521)

This is basically a pre-step for combining devmode and prodmode into a
single compilation. We are already achieving this now, and can claim
with confidence that we reduced possible actions by half. This is
especially important now that prodmode is used more often, but rules
potentially still using the devmode ESM sources. We can avoid double
compilations (which existed before the whole ESM migration too!).

We will measure this more when we have more concrete documentation
of the changes & a better planning document.

Changes:

  * ts_library will no longer generate devmode `d.ts`. Definitions are
    generated as part of prodmode. That way only prodmode can be exposed
    via providers.
  * applied the same to `ng_module`.
  * updates migrations to bundle because *everything* using `ts_library`
    is now ESM. This is actually also useful in the future if
    schematics rely on e.g. the compiler.
  * updates schematics for localize to also bundle. similar reason as
    above.

PR Close angular#48521

Author: devversion

WORKSPACE

@@ -105,7 +105,7 @@ yarn_install(
         "//:scripts/puppeteer-chromedriver-versions.js",
         "//:scripts/webdriver-manager-update.js",
         "//tools:postinstall-patches.js",
-        "//tools/esm-interop:patches/npm/@angular+build-tooling+0.0.0-d4d1329adbe1cdb5fd382d618e830c69e578c41b.patch",
+        "//tools/esm-interop:patches/npm/@angular+build-tooling+0.0.0-246cebbf2a78566ff1fe9b88fdde2459606568dc.patch",
         "//tools/esm-interop:patches/npm/@bazel+concatjs+5.7.1.patch",
         "//tools/esm-interop:patches/npm/@bazel+esbuild+5.7.1.patch",
         "//tools/esm-interop:patches/npm/@bazel+protractor+5.7.1.patch",

aio/content/examples/examples.bzl

@@ -190,15 +190,13 @@ def docs_example(name, test = True, test_tags = [], test_exec_properties = {}, f
         nodejs_test(
             name = "e2e",
             data = [
+                ":%s" % name,
+                YARN_LABEL,
                 "@aio_npm//@angular/build-tooling/bazel/browsers/chromium",
                 "//aio/tools/examples:run-example-e2e",
                 "//aio/tools:windows-chromium-path",
                 # We install the whole node modules for runtime deps of e2e tests
                 "@{workspace}//:node_modules_files".format(workspace = EXAMPLE_DEPS_WORKSPACE_NAME),
-            ],
-            data_for_expansion = [
-                ":%s" % name,
-                YARN_LABEL,
             ] + select({
                 "//aio:aio_local_deps": LOCAL_PACKAGE_DEPS,
                 "//conditions:default": [],

aio/scripts/BUILD.bazel

@@ -84,9 +84,9 @@ nodejs_test(
     testonly = True,
     data = [
         ":audit-web-app",
+        ":audit-web-app-script",
         "@aio_npm//shelljs",
     ],
-    data_for_expansion = [":audit-web-app-script"],
     entry_point = "test-aio-a11y.mjs",
     env = {
         "AUDIT_SCRIPT_PATH": "$(rootpath :audit-web-app-script)",

aio/scripts/local_server_test.bzl

@@ -15,11 +15,6 @@ def local_server_test(name, entry_point, serve_target, data = [], args = [], **k
     nodejs_test(
         name = name,
         testonly = True,
-        data_for_expansion = [
-            serve_target,
-            entry_point,
-            "@aio_npm//light-server/bin:light-server",
-        ],
         args = [
             "$(rootpath @aio_npm//light-server/bin:light-server)",
             "$(rootpath %s)" % serve_target,
@@ -30,6 +25,9 @@ def local_server_test(name, entry_point, serve_target, data = [], args = [], **k
             "@aio_npm//get-port",
             "@aio_npm//shelljs",
             "@aio_npm//tree-kill",
+            "@aio_npm//light-server/bin:light-server",
+            serve_target,
+            entry_point,
         ] + data,
         entry_point = "//aio/scripts:run-with-local-server.mjs",
         **kwargs

modules/playground/src/routing/app/inbox-app.ts

@@ -125,7 +125,7 @@ export class DraftsCmp {
 export const ROUTER_CONFIG: Routes = [
   {path: '', pathMatch: 'full', redirectTo: 'inbox'}, {path: 'inbox', component: InboxCmp},
   {path: 'drafts', component: DraftsCmp},
-  {path: 'detail', loadChildren: () => import('./inbox-detail.js').then(mod => mod.default)}
+  {path: 'detail', loadChildren: () => import('./inbox-detail').then(mod => mod.default)}
 ];
 
 @Component({selector: 'inbox-app', templateUrl: './inbox-app.html'})

package.json

@@ -179,7 +179,7 @@
   },
   "// 2": "devDependencies are not used under Bazel. Many can be removed after test.sh is deleted.",
   "devDependencies": {
-    "@angular/build-tooling": "https://github.com/angular/dev-infra-private-build-tooling-builds.git#98ed19ad0bc7e985718d240aac9c9f56f5fbcd4c",
+    "@angular/build-tooling": "https://github.com/angular/dev-infra-private-build-tooling-builds.git#c70bd1895ed5b95dc97cb57f3ef2a0f045d1700c",
     "@angular/ng-dev": "https://github.com/angular/dev-infra-private-ng-dev-builds.git#05278122c48e06eff8e5398d59c49ed6688c949b",
     "@bazel/bazelisk": "^1.7.5",
     "@bazel/buildifier": "^5.0.0",

packages/bazel/src/ng_module/ng_module.bzl

@@ -19,7 +19,6 @@ load(
     "compile_ts",
     "js_ecma_script_module_info",
     "js_module_info",
-    "js_named_module_info",
     "node_modules_aspect",
     "ts_providers_dict_to_struct",
     "tsc_wrapped_tsconfig",
@@ -184,9 +183,9 @@ def _ngc_tsconfig(ctx, files, srcs, **kwargs):
     is_devmode = "devmode_manifest" in kwargs
     outs = _expected_outs(ctx)
     if is_devmode:
-        expected_outs = outs.devmode_js + outs.declarations
+        expected_outs = outs.devmode_js
     else:
-        expected_outs = outs.closure_js
+        expected_outs = outs.closure_js + outs.declarations
 
     if not ctx.attr.type_check and ctx.attr.strict_templates:
         fail("Cannot set type_check = False and strict_templates = True for ng_module()")
@@ -390,11 +389,11 @@ def _compile_action(
 
 def _prodmode_compile_action(ctx, inputs, outputs, tsconfig_file, node_opts):
     outs = _expected_outs(ctx)
-    return _compile_action(ctx, inputs, outputs + outs.closure_js + outs.prod_perf_files, tsconfig_file, node_opts, "prodmode")
+    return _compile_action(ctx, inputs, outputs + outs.closure_js + outs.prod_perf_files + outs.declarations, tsconfig_file, node_opts, "prodmode")
 
 def _devmode_compile_action(ctx, inputs, outputs, tsconfig_file, node_opts):
     outs = _expected_outs(ctx)
-    compile_action_outputs = outputs + outs.devmode_js + outs.declarations + outs.dev_perf_files
+    compile_action_outputs = outputs + outs.devmode_js + outs.dev_perf_files
     _compile_action(ctx, inputs, compile_action_outputs, tsconfig_file, node_opts, "devmode")
 
 # Note: We need to define `label` and `srcs_files` as `tsc_wrapped` passes
@@ -448,11 +447,7 @@ def _ng_module_impl(ctx):
     # and issue https://github.com/bazelbuild/rules_nodejs/issues/57 for more details.
     ts_providers["providers"].extend([
         js_module_info(
-            sources = ts_providers["typescript"]["es5_sources"],
-            deps = ctx.attr.deps,
-        ),
-        js_named_module_info(
-            sources = ts_providers["typescript"]["es5_sources"],
+            sources = ts_providers["typescript"]["es6_sources"],
             deps = ctx.attr.deps,
         ),
         js_ecma_script_module_info(
@@ -470,7 +465,7 @@ def _ng_module_impl(ctx):
             package_name = ctx.attr.package_name,
             package_path = ctx.attr.package_path,
             path = path,
-            files = ts_providers["typescript"]["es5_sources"],
+            files = ts_providers["typescript"]["es6_sources"],
         ))
 
     return ts_providers_dict_to_struct(ts_providers)

packages/bazel/src/ng_package/BUILD.bazel

@@ -1,8 +1,4 @@
-load("@build_bazel_rules_nodejs//:index.bzl", "nodejs_binary")
-
-# BEGIN-DEV-ONLY
-load("@npm//@bazel/concatjs:index.bzl", "ts_library")
-# END-DEV-ONLY
+load("//tools:defaults.bzl", "nodejs_binary", "ts_library")
 
 package(default_visibility = ["//visibility:public"])
 

packages/bazel/test/ngc-wrapped/flat_module_test.ts

@@ -16,8 +16,8 @@ describe('flat_module ng_module', () => {
 
   beforeAll(() => {
     packageOutput =
-        dirname(runfiles.resolve('angular/packages/bazel/test/ngc-wrapped/flat_module/index.js'));
-    flatModuleOutFile = join(packageOutput, 'flat_module.js');
+        dirname(runfiles.resolve('angular/packages/bazel/test/ngc-wrapped/flat_module/index.mjs'));
+    flatModuleOutFile = join(packageOutput, 'flat_module.mjs');
   });
 
   it('should have a flat module out file', () => {

packages/bazel/test/ngc-wrapped/ivy_enabled/ng_module_ivy_test.ts

@@ -12,7 +12,7 @@ import {readFileSync} from 'fs';
 describe('ng_module with ivy enabled', () => {
   it('should generate definitions as with full compilation mode', () => {
     const outputFile = runfiles.resolveWorkspaceRelative(
-        'packages/bazel/test/ngc-wrapped/ivy_enabled/test_module_default_compilation.js');
+        'packages/bazel/test/ngc-wrapped/ivy_enabled/test_module_default_compilation.mjs');
     const fileContent = readFileSync(outputFile, 'utf8');
     expect(fileContent).toContain(`TestComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent(`);
   });