CJS -> ESM migration

.github/workflows/documentation.yml

@@ -14,7 +14,7 @@ jobs:
       - uses: actions/checkout@v1
       - uses: actions/setup-node@v1
         with:
-          node-version: '18.x'
+          node-version: '20.17.x'
       - name: Generate docs
         run: |
           yarn install --frozen-lockfile
@@ -32,7 +32,7 @@ jobs:
       - uses: actions/checkout@v1
       - uses: actions/setup-node@v1
         with:
-          node-version: '18.x'
+          node-version: '20.17.x'
       - uses: webfactory/[email protected]
         with:
           ssh-private-key: ${{ secrets.GH_PAGES_DEPLOY }}

.github/workflows/release.yml

@@ -16,10 +16,10 @@ jobs:
           # This makes Actions fetch all Git history so that Changesets can generate changelogs with the correct commits
           fetch-depth: 0
 
-      - name: Setup Node.js 18.x
+      - name: Setup Node.js 20.17.x
         uses: actions/setup-node@master
         with:
-          node-version: 18.x
+          node-version: 20.17.x
 
       - name: Install Dependencies
         run: yarn

.github/workflows/test-integration.yml

@@ -11,7 +11,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [18.x]
+        node-version: [20.17.x]
 
     steps:
       - uses: actions/checkout@v2

.github/workflows/test.yml

@@ -12,7 +12,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [18.x]
+        node-version: [20.17.x]
 
     steps:
       - uses: actions/checkout@v2

.github/workflows/validate.yml

@@ -12,7 +12,7 @@ jobs:
 
     strategy:
       matrix:
-        node-version: [18.x]
+        node-version: [20.17.x]
 
     steps:
       - uses: actions/checkout@v2

.nvmrc

@@ -1 +1 @@
-v18
+v20.17.0

jest.config.js

@@ -1,4 +1,5 @@
 module.exports = {
+  testEnvironment: 'node',
   transform: {
     '^.+\\.ts$': [
       'ts-jest',

packages/cli-alias/package.json

@@ -19,6 +19,6 @@
     "ts-node": "^10.9.1"
   },
   "engines": {
-    "node": ">=14"
+    "node": ">=20"
   }
 }

packages/cli/package.json

@@ -29,13 +29,13 @@
     "fs-extra": "^9.1.0",
     "inquirer": "^8.2.4",
     "jscodeshift": "^0.13.1",
-    "live-plugin-manager": "^0.18.1",
     "lodash": "^4.17.21",
     "ora": "^5.4.1",
     "semver": "^7.3.5",
-    "ts-node": "^10.9.1"
+    "ts-node": "^10.9.1",
+    "tsx": "^4.19.1"
   },
   "engines": {
-    "node": ">=14"
+    "node": ">=20"
   }
 }

packages/cli/src/index.ts

@@ -66,10 +66,6 @@ program
     '--registryToken <value>',
     'Define an authentication token to use as credentials for the registry',
   )
-  .option(
-    '--experimental-loader',
-    'Enables the experimental package downloader',
-  )
   .addOption(
     new Option(
       '--verbose <parser>',

packages/cli/src/list.ts

@@ -1,19 +1,14 @@
 import chalk from 'chalk';
-import { PluginManager } from 'live-plugin-manager';
 
 import { fetchPackages } from './utils/fetch-package';
 import { getHypermodPackageName } from './utils/package-names';
 
 export default async function list(packages: string[]) {
-  const packageManager = new PluginManager();
   const configs = [];
 
   for (const packageName of packages) {
     try {
-      const { community, remote } = await fetchPackages(
-        packageName,
-        packageManager,
-      );
+      const { community, remote } = await fetchPackages(packageName);
       community &&
         configs.push({
           packageName: getHypermodPackageName(packageName),

packages/cli/src/main.ts

@@ -1,11 +1,7 @@
-import path from 'path';
 import semver from 'semver';
 import chalk from 'chalk';
 import findUp from 'find-up';
 import inquirer from 'inquirer';
-import fs from 'fs-extra';
-import { PluginManager, PluginManagerOptions } from 'live-plugin-manager';
-import { installPackage } from '@antfu/install-pkg';
 
 import * as core from '@hypermod/core';
 import { fetchConfigAtPath } from '@hypermod/fetcher';
@@ -16,54 +12,7 @@ import { mergeConfigs } from './utils/merge-configs';
 import { fetchConfigsForWorkspaces, getPackageJson } from './utils/file-system';
 import { getConfigPrompt, getMultiConfigPrompt } from './prompt';
 
-const ExperimentalModuleLoader = () => {
-  const getInfo = (packageName: string) => {
-    const entryPath = require.resolve(packageName);
-    const location = entryPath.split(packageName)[0] + packageName;
-    const pkgJsonRaw = fs.readFileSync(
-      path.join(location, 'package.json'),
-      'utf8',
-    );
-    const pkgJson = JSON.parse(pkgJsonRaw);
-
-    return {
-      location,
-      entryPath,
-      pkgJson,
-    };
-  };
-
-  const install = async (packageName: string) => {
-    await installPackage(packageName, {
-      cwd: __dirname,
-      packageManager: 'npm',
-      additionalArgs: ['--force'],
-    });
-
-    const { pkgJson } = getInfo(packageName);
-
-    // Install whitelisted devDependencies
-    if (pkgJson?.hypermod?.dependencies) {
-      await Promise.all(
-        pkgJson.hypermod.dependencies.map((dep: string) => {
-          const version = pkgJson.devDependencies[dep];
-          if (!version) return;
-          return installPackage(`${dep}@${version}`, {
-            cwd: __dirname,
-            packageManager: 'npm',
-            additionalArgs: ['--force'],
-          });
-        }),
-      );
-    }
-  };
-
-  return {
-    install,
-    getInfo,
-    require: (packageName: string) => require(packageName),
-  };
-};
+import ModuleLoader from './utils/module-loader';
 
 export default async function main(
   paths: string[],
@@ -75,25 +24,10 @@ export default async function main(
     );
   }
 
-  const pluginManagerConfig: Partial<PluginManagerOptions> = {
-    pluginsPath: path.join(__dirname, '..', 'node_modules'),
-  };
-
-  // If a registry is provided in the CLI flags, use it for the pluginManagers configuration.
-  if (flags.registry !== undefined) {
-    pluginManagerConfig.npmRegistryUrl = flags.registry;
-  }
-
-  // If a registryToken is provided in the CLI flags, use it as an authentication token for the pluginManager
-  if (flags.registryToken !== undefined) {
-    pluginManagerConfig.npmRegistryConfig = {
-      auth: { token: flags.registryToken },
-    };
-  }
-
-  const packageManager = flags.experimentalLoader
-    ? ExperimentalModuleLoader()
-    : new PluginManager(pluginManagerConfig);
+  const moduleLoader = ModuleLoader({
+    npmRegistryUrl: flags.registry,
+    authToken: flags.registryToken,
+  });
 
   let transforms: string[] = [];
 
@@ -233,11 +167,7 @@ export default async function main(
         .filter(id => id.startsWith('#'))
         .map(id => id.substring(1));
 
-      const { community, remote } = await fetchPackages(
-        pkgName,
-        // @ts-expect-error Experimental loader
-        packageManager,
-      );
+      const { community, remote } = await fetchPackages(pkgName, moduleLoader);
 
       const config = mergeConfigs(community, remote);
 

packages/cli/src/utils/fetch-package.ts

@@ -1,6 +1,5 @@
 import ora from 'ora';
 import chalk from 'chalk';
-import { PluginManager } from 'live-plugin-manager';
 
 import {
   fetchPackage,
@@ -10,10 +9,11 @@ import {
 import { isValidConfig } from '@hypermod/validator';
 
 import { getHypermodPackageName } from './package-names';
+import ModuleLoader from './module-loader';
 
 export async function fetchPackages(
   packageName: string,
-  packageManager: PluginManager,
+  moduleLoader: ReturnType<typeof ModuleLoader>,
 ) {
   const hypermodPackageName = getHypermodPackageName(packageName);
   let hypermodPackage: ConfigMeta | undefined;
@@ -24,7 +24,7 @@ export async function fetchPackages(
   ).start();
 
   try {
-    hypermodPackage = await fetchPackage(hypermodPackageName, packageManager);
+    hypermodPackage = await fetchPackage(hypermodPackageName, moduleLoader);
     spinner.succeed(
       `${chalk.green('Found Hypermod package:')} ${hypermodPackageName}`,
     );
@@ -46,7 +46,7 @@ export async function fetchPackages(
     spinner.info(
       `${chalk.green(`Attempting to download npm package:`)} ${packageName}`,
     );
-    remotePackage = await fetchRemotePackage(packageName, packageManager);
+    remotePackage = await fetchRemotePackage(packageName, moduleLoader);
     spinner.succeed(
       `${chalk.green('Found remote Hypermod package:')} ${packageName}`,
     );

packages/cli/src/utils/module-loader.ts

@@ -0,0 +1,74 @@
+import path from 'path';
+import fs from 'fs-extra';
+import { installPackage } from '@antfu/install-pkg';
+
+/**
+ * Register the TSX plugin to allow require TS(X) files.
+ */
+import { register } from 'tsx/esm/api';
+register();
+
+const ModuleLoader = (config: {
+  npmRegistryUrl?: string;
+  authToken?: string;
+}) => {
+  const getInfo = async (packageName: string) => {
+    // @ts-expect-error Experimental loader
+    const entryPath = await import.meta.resolve(packageName);
+    const location = (entryPath.split(packageName)[0] + packageName).replace(
+      'file://',
+      '',
+    );
+    const pkgJsonRaw = fs.readFileSync(
+      path.join(location.replace('file://', ''), 'package.json'),
+      'utf8',
+    );
+    const pkgJson = JSON.parse(pkgJsonRaw);
+
+    return { location, entryPath, pkgJson };
+  };
+
+  const install = async (packageName: string) => {
+    // @ts-expect-error
+    const __dirname = path.dirname(new URL(import.meta.url).pathname);
+    await installPackage(packageName, {
+      cwd: __dirname,
+      packageManager: 'npm',
+      additionalArgs: [
+        '--force',
+        // --registry=https://your-custom-registry-url/ --//your-custom-registry-url/:_authToken=YOUR_AUTH_TOKEN
+        ...(config.npmRegistryUrl
+          ? [`--registry=${config.npmRegistryUrl}`]
+          : []),
+        ...(config.authToken
+          ? [`${config.npmRegistryUrl}/:_authToken=${config.authToken}`]
+          : []),
+      ],
+    });
+
+    const { pkgJson } = await getInfo(packageName);
+
+    // Install whitelisted devDependencies
+    if (pkgJson?.hypermod?.dependencies) {
+      await Promise.all(
+        pkgJson.hypermod.dependencies.map((dep: string) => {
+          const version = pkgJson.devDependencies[dep];
+          if (!version) return;
+          return installPackage(`${dep}@${version}`, {
+            cwd: __dirname,
+            packageManager: 'npm',
+            additionalArgs: ['--force'],
+          });
+        }),
+      );
+    }
+  };
+
+  return {
+    install,
+    getInfo,
+    require: async (packageName: string) => import(packageName),
+  };
+};
+
+export default ModuleLoader;