Unable to use relay.config.js with ESM module

[steinybot]

trafficstars

ESM

Node: 18.5.0

package.json:

{
  "type": "module",
  "scripts": {
    "relay": "relay-compiler"
  },
  "devDependencies": {
    "relay-compiler": "^14.1.0"
  }
}

relay.config.js:

export default {}

Run: yarn run relay

It fails with:

yarn run v1.22.19
$ relay-compiler
[ERROR] Unable to initialize relay compiler configuration. Error details:
Error searching config: Invalid config file: "/Users/jason/src/bug-reports/relay.config.js": Error running node: node:internal/modules/cjs/loader:1163
      throw err;
      ^

Error [ERR_REQUIRE_ESM]: require() of ES Module /Users/jason/src/bug-reports/relay.config.js from /Users/jason/src/bug-reports/[eval] not supported.
Instead change the require of relay.config.js in /Users/jason/src/bug-reports/[eval] to a dynamic import() which is available in all CommonJS modules.
    at [eval]:1:37
    at Script.runInThisContext (node:vm:130:12)
    at Object.runInThisContext (node:vm:306:38)
    at [eval]-wrapper:6:22 {
  code: 'ERR_REQUIRE_ESM'
}

Node.js v18.5.0

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

CJS (.js)

See what happens if we modify it to be CJS:

relay.config.js:

module.exports = {}

Run: yarn run relay

It fails with:

yarn run v1.22.19
$ relay-compiler
[ERROR] Unable to initialize relay compiler configuration. Error details:
Error searching config: Invalid config file: "/Users/jason/src/bug-reports/relay.config.js": Error running node: node:internal/modules/cjs/loader:1163
      throw err;
      ^

Error [ERR_REQUIRE_ESM]: require() of ES Module /Users/jason/src/bug-reports/relay.config.js from /Users/jason/src/bug-reports/[eval] not supported.
relay.config.js is treated as an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which declares all .js files in that package scope as ES modules.
Instead rename relay.config.js to end in .cjs, change the requiring code to use dynamic import() which is available in all CommonJS modules, or change "type": "module" to "type": "commonjs" in /Users/jason/src/bug-reports/package.json to treat all .js files as CommonJS (using .mjs for all ES modules instead).

    at [eval]:1:37
    at Script.runInThisContext (node:vm:130:12)
    at Object.runInThisContext (node:vm:306:38)
    at [eval]-wrapper:6:22 {
  code: 'ERR_REQUIRE_ESM'
}

Node.js v18.5.0

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

CJS (.cjs)

Now try and rename it from relay.config.js to relay.config.cjs like it says.

Also update package.json to:

{
  "type": "module",
  "scripts": {
    "relay": "relay-compiler relay.config.cjs"
  },
  "devDependencies": {
    "relay-compiler": "^14.1.0"
  }
}

Run: yarn run relay

Now it fails with:

yarn run v1.22.19
$ relay-compiler relay.config.cjs
[ERROR] Unable to initialize relay compiler configuration. Error details:
Invalid file extension. Expected `.js` or `.json`. Provided file "relay.config.cjs".
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

[smmoosavi]

JSON formats work correctly if you don't need to run js.

[simnalamburt]

relay-compiler once accepted relay.config.cjs as a valid config file in the past. And I think doing so once again will be an easiest fix to this issue. I'm willing to implement it if relay team says that's acceptible fix.

Any thought?

[2ssue]

See also: https://github.com/facebook/relay/commit/c20ed27ec4d28a0585e185a607ee6ce1064c61e1

[alunyov]

relay-compiler once accepted relay.config.cjs as a valid config file in the past. And I think doing so once again will be an easiest fix to this issue. I'm willing to implement it if relay team says that's acceptible fix.

Any thought?

Oh, we probably removed cjs by mistake.

[github2023spring]

Will we add back the support for CJS? Thank you!

[HallexCosta]

JSON formats work correctly if you don't need to run js.

Convert the relay.config.js to relay.config.json apparently solves my problem, seems the relay has some issues with the compatibility between ESModulesJS and CommonJS

Environment: package.json use the "type": "module" relay version: 15.0.0 vite: 5.4.1 and using the vite-plugin-relay-lite library to define plugin configs to run with relay

[jantimon]

I created a fix in #4873 which handles all three module format scenarios:

• Native ES modules (.mjs)
• CommonJS modules (.cjs)
• Regular .js files that respect the package.json "type" field

[lynnshaoyu]

thank you @jantimon !!!!