Support for ESM plugins and configs (#8913)

.github/workflows/ci.yml

@@ -86,6 +86,7 @@ jobs:
         if: ${{matrix.os == 'ubuntu-latest'}}
       - run: yarn --frozen-lockfile
       - run: yarn build-native-release
+      - run: yarn build
       - run: yarn test:integration-ci
       # Similar to
       # https://github.com/marketplace/actions/publish-unit-test-results#use-with-matrix-strategy

Cargo.toml

@@ -7,5 +7,6 @@ members = [
   "packages/utils/hash",
   "packages/optimizers/image",
   "packages/utils/node-resolver-rs",
-  "packages/utils/node-resolver-core"
+  "packages/utils/node-resolver-core",
+  "packages/utils/dev-dep-resolver"
 ]

package.json

@@ -24,7 +24,7 @@
     "check": "flow check",
     "lint": "eslint . && prettier \"./packages/*/*/{src,bin,test}/**/*.{js,json,md}\" --list-different && cargo fmt --all -- --check",
     "prepublishOnly": "yarn adjust-versions && yarn build && yarn build-ts",
-    "test:unit": "cross-env NODE_ENV=test mocha && cargo test --package parcel-js-swc-core --lib",
+    "test:unit": "cross-env NODE_ENV=test mocha --timeout 5000 && cargo test",
     "test:integration": "yarn workspace @parcel/integration-tests test",
     "test:integration-ci": "yarn workspace @parcel/integration-tests test-ci",
     "test": "yarn test:unit && yarn test:integration",

packages/core/core/src/public/Config.js

@@ -11,7 +11,13 @@ import type {
 import type {Config, ParcelOptions} from '../types';
 
 import invariant from 'assert';
-import {DefaultWeakMap, loadConfig} from '@parcel/utils';
+import path from 'path';
+import {
+  DefaultWeakMap,
+  resolveConfig,
+  readConfig,
+  relativePath,
+} from '@parcel/utils';
 import Environment from './Environment';
 import {fromProjectPath, toProjectPath} from '../projectPath';
 
@@ -149,22 +155,64 @@ export default class PublicConfig implements IConfig {
     }
 
     let parse = options && options.parse;
-    let conf = await loadConfig(
+    let configFilePath = await resolveConfig(
       this.#options.inputFS,
       searchPath,
       fileNames,
       this.#options.projectRoot,
-      parse == null ? null : {parse},
     );
-    if (conf == null) {
+    if (configFilePath == null) {
       return null;
     }
 
-    let configFilePath = conf.files[0].filePath;
     if (!options || !options.exclude) {
       this.invalidateOnFileChange(configFilePath);
     }
 
+    // If this is a JavaScript file, load it with the package manager.
+    let extname = path.extname(configFilePath);
+    if (extname === '.js' || extname === '.cjs' || extname === '.mjs') {
+      let specifier = relativePath(path.dirname(searchPath), configFilePath);
+
+      // Add dev dependency so we reload the config and any dependencies in watch mode.
+      this.addDevDependency({
+        specifier,
+        resolveFrom: searchPath,
+      });
+
+      // Invalidate on startup in case the config is non-deterministic,
+      // e.g. uses unknown environment variables, reads from the filesystem, etc.
+      this.invalidateOnStartup();
+
+      let config = await this.#options.packageManager.require(
+        specifier,
+        searchPath,
+      );
+
+      if (
+        // $FlowFixMe
+        Object.prototype.toString.call(config) === '[object Module]' &&
+        config.default != null
+      ) {
+        // Native ESM config. Try to use a default export, otherwise fall back to the whole namespace.
+        config = config.default;
+      }
+
+      return {
+        contents: config,
+        filePath: configFilePath,
+      };
+    }
+
+    let conf = await readConfig(
+      this.#options.inputFS,
+      configFilePath,
+      parse == null ? null : {parse},
+    );
+    if (conf == null) {
+      return null;
+    }
+
     return {
       contents: conf.config,
       filePath: configFilePath,

packages/core/core/src/requests/DevDepRequest.js

@@ -83,6 +83,7 @@ export async function createDevDependency(
       invalidateOnFileCreateToInternal(options.projectRoot, i),
     ),
     invalidateOnFileChange: new Set(invalidateOnFileChangeProject),
+    invalidateOnStartup: invalidations.invalidateOnStartup,
     additionalInvalidations,
   };
 
@@ -195,6 +196,10 @@ export async function runDevDepRequest<TResult>(
         api.invalidateOnFileCreate(invalidation);
       }
 
+      if (devDepRequest.invalidateOnStartup) {
+        api.invalidateOnStartup();
+      }
+
       api.storeResult({
         specifier: devDepRequest.specifier,
         resolveFrom: devDepRequest.resolveFrom,

packages/core/core/src/types.js

@@ -248,6 +248,7 @@ export type DevDepRequest = {|
   hash: string,
   invalidateOnFileCreate?: Array<InternalFileCreateInvalidation>,
   invalidateOnFileChange?: Set<ProjectPath>,
+  invalidateOnStartup?: boolean,
   additionalInvalidations?: Array<{|
     specifier: DependencySpecifier,
     resolveFrom: ProjectPath,