fix(angular): inline loading @angular/compiler-cli in ng-packagr exec…

…utors (#20062)

packages/angular/src/executors/ng-packagr-lite/ng-packagr-adjustments/ngc/compile-source-files.ts

@@ -20,10 +20,10 @@ import {
 } from 'ng-packagr/lib/ng-package/nodes';
 import { augmentProgramWithVersioning } from 'ng-packagr/lib/ts/cache-compiler-host';
 import * as log from 'ng-packagr/lib/utils/log';
-import { ngCompilerCli } from 'ng-packagr/lib/utils/ng-compiler-cli';
 import { join } from 'node:path';
 import * as ts from 'typescript';
 import { getInstalledAngularVersionInfo } from '../../../utilities/angular-version-utils';
+import { ngCompilerCli } from '../../../utilities/ng-compiler-cli';
 import { NgPackagrOptions } from '../ng-package/options.di';
 import { StylesheetProcessor } from '../styles/stylesheet-processor';
 import { cacheCompilerHost } from '../ts/cache-compiler-host';

packages/angular/src/executors/package/ng-packagr-adjustments/ngc/compile-source-files.ts

@@ -19,10 +19,10 @@ import {
   isPackage,
 } from 'ng-packagr/lib/ng-package/nodes';
 import * as log from 'ng-packagr/lib/utils/log';
-import { ngCompilerCli } from 'ng-packagr/lib/utils/ng-compiler-cli';
 import { join } from 'node:path';
 import * as ts from 'typescript';
 import { getInstalledAngularVersionInfo } from '../../../utilities/angular-version-utils';
+import { ngCompilerCli } from '../../../utilities/ng-compiler-cli';
 import { NgPackagrOptions } from '../ng-package/options.di';
 import { StylesheetProcessor } from '../styles/stylesheet-processor';
 import {

packages/angular/src/executors/utilities/ng-compiler-cli.ts

@@ -0,0 +1,31 @@
+export function ngCompilerCli(): Promise<
+  typeof import('@angular/compiler-cli')
+> {
+  return loadEsmModule('@angular/compiler-cli');
+}
+
+/**
+ * Lazily compiled dynamic import loader function.
+ */
+let load: (<T>(modulePath: string | URL) => Promise<T>) | undefined;
+
+/**
+ * This uses a dynamic import to load a module which may be ESM.
+ * CommonJS code can load ESM code via a dynamic import. Unfortunately, TypeScript
+ * will currently, unconditionally downlevel dynamic import into a require call.
+ * require calls cannot load ESM code and will result in a runtime error. To workaround
+ * this, a Function constructor is used to prevent TypeScript from changing the dynamic import.
+ * Once TypeScript provides support for keeping the dynamic import this workaround can
+ * be dropped.
+ *
+ * @param modulePath The path of the module to load.
+ * @returns A Promise that resolves to the dynamically imported module.
+ */
+export function loadEsmModule<T>(modulePath: string | URL): Promise<T> {
+  load ??= new Function('modulePath', `return import(modulePath);`) as Exclude<
+    typeof load,
+    undefined
+  >;
+
+  return load(modulePath);
+}