Dynamic compiler capability

CHANGELOG.md

@@ -6,6 +6,7 @@
 - Fixed issue with pre-TypeScript 5 versions with module resolution set to `bundler`
 - Fixed handling of max event listeners for `pilet debug`
 - Updated to latest version of `dets`
+- Added dynamic compiler capability to `piral-ng`
 
 ## 1.5.5 (May 10, 2024)
 

src/converters/piral-ng/compiler-dynamic.js

@@ -0,0 +1,57 @@
+import info from '@angular/compiler/package.json';
+
+const url = new URL('.', __system_context__.meta.url);
+
+if (typeof window.ngVersions === 'undefined') {
+  window.ngVersions = {};
+}
+
+window.ngVersions[url.href] = info.version;
+
+const existing = Object.getOwnPropertyDescriptor(window, 'ng');
+
+if (existing?.get === undefined) {
+  const defaultVersion = 'default';
+  const ngs = {
+    [defaultVersion]: existing?.value,
+  };
+
+  function getUrl() {
+    const { stack } = new Error();
+    const lines = stack?.split('\n') || [];
+
+    if (lines[0] === 'Error') {
+      // V8
+      const line = lines[3] || '';
+      return /\((.*):\d+:\d+\)$/.exec(line)?.[1] || '';
+    } else {
+      // SpiderMonkey and JavaScriptCore
+      const line = lines[2] || '';
+      return /@(.*):\d+:\d+$/.exec(line)?.[1] || '';
+    }
+  }
+
+  function getNgVersion(url) {
+    try {
+      const baseUrl = new URL('.', url);
+      const version = window.ngVersions[baseUrl];
+      return version || defaultVersion;
+    } catch {
+      return defaultVersion;
+    }
+  }
+
+  Object.defineProperty(window, 'ng', {
+    configurable: true,
+    get() {
+      const url = getUrl();
+      const version = getNgVersion(url);
+      return ngs[version];
+    },
+    set(value) {
+      const url = getUrl();
+      const version = getNgVersion(url);
+      ngs[version] = value;
+    },
+  });
+}

src/converters/piral-ng/extend-webpack.js

@@ -101,18 +101,30 @@ module.exports =
     );
 
     if (jitMode) {
-      // The job of this plugin is to make angular-core depend on angular-compiler - this way
-      // angular-compiler does not need to be loaded separately and angular-compiler is present
-      // *before* angular-core
-      // this is only required in jit mode - as otherwise everything should be pre-compiled
+      // The job of this plugin is 
+      // (1)
+      // to make @angular/core depend on @angular/compiler - this way @angular/compiler
+      // does not need to be loaded separately and @angular/compiler is present *before*
+      // @angular/core; this is only required in jit mode - as otherwise everything should
+      // be pre-compiled.
+      // (2)
+      // to introduce a dynamic version of the window.ng global, which supports running
+      // with multiple versions of Angular.
       config.plugins.push({
         apply(compiler) {
           const { entry } = compiler.options;
-          const core = entry['angular-core'];
+          const coreEntry = entry['angular-core'];
 
-          if (typeof core !== 'undefined') {
+          if (typeof coreEntry !== 'undefined') {
             const compilerDependency = resolve(__dirname, 'core-dynamic.js');
-            core.import = [compilerDependency, ...core.import];
+            coreEntry.import = [compilerDependency, ...coreEntry.import];
+          }
+
+          const compilerEntry = entry['angular-compiler'];
+
+          if (typeof compilerEntry !== 'undefined') {
+            const compilerDependency = resolve(__dirname, 'compiler-dynamic.js');
+            compilerEntry.import = [compilerDependency, ...compilerEntry.import];
           }
         },
       });

src/converters/piral-ng/package.json

@@ -27,6 +27,9 @@
     "./common": {
       "import": "./common.js"
     },
+    "./compiler-dynamic": {
+      "import": "./compiler-dynamic.js"
+    },
     "./convert": {
       "import": "./convert.js"
     },
@@ -58,6 +61,7 @@
     "src",
     "common.d.ts",
     "common.js",
+    "compiler-dynamic.js",
     "convert.d.ts",
     "convert.js",
     "core-dynamic.js",