build: fix ng_package & ng_rollup_bundle windows issues (#33607)

Fixes ng_package and ng_rollup_bundle rollup issue on Windows where .js file was resolved by bazel resolved instead of .mjs file as there is no sandbox.

Fixes https://github.com/angular/angular/issues/32603 by passing globals and external through templated rollup config as Windows CLI argument limit can be easily exceeded. Also fixes this for ng_rollup_bundle.

PR Close #33607

packages/bazel/src/ng_package/ng_package.bzl

@@ -197,7 +197,7 @@ def _compute_node_modules_root(ctx):
         node_modules_root = "external/npm/node_modules"
     return node_modules_root
 
-def _write_rollup_config(ctx, root_dir, filename = "_%s.rollup.conf.js"):
+def _write_rollup_config(ctx, root_dir, filename = "_%s.rollup.conf.js", include_tslib = False):
     """Generate a rollup config file.
 
     Args:
@@ -220,6 +220,15 @@ def _write_rollup_config(ctx, root_dir, filename = "_%s.rollup.conf.js"):
                           (dep.label, k, mappings[k], v)), "deps")
                 mappings[k] = v
 
+    globals = dict(WELL_KNOWN_GLOBALS, **ctx.attr.globals)
+    external = globals.keys()
+    if not include_tslib:
+        external.append("tslib")
+
+    # Pass external & globals through a templated config file because on Windows there is
+    # an argument limit and we there might be a lot of globals which need to be passed to
+    # rollup.
+
     ctx.actions.expand_template(
         output = config,
         template = ctx.file.rollup_config_tmpl,
@@ -230,17 +239,19 @@ def _write_rollup_config(ctx, root_dir, filename = "_%s.rollup.conf.js"):
             "TMPL_root_dir": root_dir,
             "TMPL_stamp_data": "\"%s\"" % ctx.version_file.path if ctx.version_file else "undefined",
             "TMPL_workspace_name": ctx.workspace_name,
+            "TMPL_external": ", ".join(["'%s'" % e for e in external]),
+            "TMPL_globals": ", ".join(["'%s': '%s'" % g for g in globals.items()]),
         },
     )
 
     return config
 
-def _run_rollup(ctx, bundle_name, rollup_config, entry_point, inputs, js_output, format, module_name = "", include_tslib = False):
+def _run_rollup(ctx, bundle_name, rollup_config, entry_point, inputs, js_output, format, module_name = ""):
     map_output = ctx.actions.declare_file(js_output.basename + ".map", sibling = js_output)
 
     args = ctx.actions.args()
-    args.add("--config", rollup_config)
     args.add("--input", entry_point)
+    args.add("--config", rollup_config)
     args.add("--output.file", js_output)
     args.add("--output.format", format)
     if module_name:
@@ -268,18 +279,6 @@ def _run_rollup(ctx, bundle_name, rollup_config, entry_point, inputs, js_output,
 
     args.add("--preserveSymlinks")
 
-    globals = dict(WELL_KNOWN_GLOBALS, **ctx.attr.globals)
-    external = globals.keys()
-    if not include_tslib:
-        external.append("tslib")
-    args.add_joined("--external", external, join_with = ",")
-
-    args.add_joined(
-        "--globals",
-        ["%s:%s" % g for g in globals.items()],
-        join_with = ",",
-    )
-
     # We will produce errors as needed. Anything else is spammy: a well-behaved
     # bazel rule prints nothing on success.
     args.add("--silent")
@@ -496,6 +495,7 @@ def _ng_package_impl(ctx):
 
         esm2015_config = _write_rollup_config(ctx, ctx.bin_dir.path, filename = "_%s.rollup_esm2015.conf.js")
         esm5_config = _write_rollup_config(ctx, "/".join([ctx.bin_dir.path, ctx.label.package, esm5_root_dir(ctx)]), filename = "_%s.rollup_esm5.conf.js")
+        esm5_tslib_config = _write_rollup_config(ctx, "/".join([ctx.bin_dir.path, ctx.label.package, esm5_root_dir(ctx)]), filename = "_%s.rollup_esm5_tslib.conf.js", include_tslib = True)
 
         fesm2015.append(
             _run_rollup(
@@ -525,13 +525,12 @@ def _ng_package_impl(ctx):
             _run_rollup(
                 ctx,
                 "umd",
-                esm5_config,
+                esm5_tslib_config,
                 es5_entry_point,
                 esm5_rollup_inputs,
                 umd_output,
                 module_name = module_name,
                 format = "umd",
-                include_tslib = True,
             ),
         )
         terser_sourcemap = _terser(

packages/bazel/src/ng_package/rollup.config.js

@@ -113,6 +113,13 @@ function resolveBazel(
   }
 
   if (resolved) {
+    if (path.extname(resolved) == '.js') {
+      // check for .mjs file and prioritize that
+      const resolved_mjs = resolved.substr(0, resolved.length - 3) + '.mjs';
+      if (fileExists(resolved_mjs)) {
+        resolved = resolved_mjs;
+      }
+    }
     log_verbose(`resolved to ${resolved}`);
   } else {
     log_verbose(`allowing rollup to resolve '${importee}' with node module resolution`);
@@ -152,8 +159,10 @@ const plugins = [
 
 const config = {
   plugins,
+  external: [TMPL_external],
   output: {
-      banner,
+    globals: {TMPL_globals},
+    banner,
   }
 };
 

tools/ng_rollup_bundle/ng_rollup_bundle.bzl

@@ -255,6 +255,12 @@ def _write_rollup_config(ctx, root_dir, build_optimizer, filename = "_%s.rollup.
                           (dep.label, k, mappings[k], v)), "deps")
                 mappings[k] = v
 
+    globals = {}
+    external = []
+    if ctx.attr.globals:
+        globals = ctx.attr.globals.items()
+        external = ctx.attr.globals.keys()
+
     ctx.actions.expand_template(
         output = config,
         template = ctx.file._rollup_config_tmpl,
@@ -266,6 +272,8 @@ def _write_rollup_config(ctx, root_dir, build_optimizer, filename = "_%s.rollup.
             "TMPL_root_dir": root_dir,
             "TMPL_stamp_data": "\"%s\"" % ctx.version_file.path if ctx.version_file else "undefined",
             "TMPL_workspace_name": ctx.workspace_name,
+            "TMPL_external": ", ".join(["'%s'" % e for e in external]),
+            "TMPL_globals": ", ".join(["'%s': '%s'" % g for g in globals]),
         },
     )
 
@@ -295,12 +303,6 @@ def _run_rollup(ctx, entry_point_path, sources, config):
 
     args.add("--preserveSymlinks")
 
-    if ctx.attr.globals:
-        args.add("--external")
-        args.add_joined(ctx.attr.globals.keys(), join_with = ",")
-        args.add("--globals")
-        args.add_joined(["%s:%s" % g for g in ctx.attr.globals.items()], join_with = ",")
-
     direct_inputs = [config]
 
     # Also include files from npm fine grained deps as inputs.

tools/ng_rollup_bundle/rollup.config.js

@@ -117,6 +117,13 @@ function resolveBazel(
   }
 
   if (resolved) {
+    if (path.extname(resolved) == '.js') {
+      // check for .mjs file and prioritize that
+      const resolved_mjs = resolved.substr(0, resolved.length - 3) + '.mjs';
+      if (fileExists(resolved_mjs)) {
+        resolved = resolved_mjs;
+      }
+    }
     log_verbose(`resolved to ${resolved}`);
   } else {
     log_verbose(`allowing rollup to resolve '${importee}' with node module resolution`);
@@ -174,8 +181,10 @@ if (bannerFile) {
 
 const config = {
   plugins,
+  external: [TMPL_external],
   output: {
-      banner,
+    globals: {TMPL_globals},
+    banner,
   }
 };