ESLint fails with ESM and JS eslintrc

ESLint fails in a very minimal installation when ESM are used and the .eslintrc format is JS.

The eslint CLI tries to load the .eslintrc.js with require, which fails if you’ve set "type": "module" in your package.json.

Steps to reproduce this issue:

1. Create and enter a new directory
2. npm init -y
3. eslint --init ✔ How would you like to use ESLint? · style ✔ What type of modules does your project use? · esm ✔ Which framework does your project use? · none ✔ Does your project use TypeScript? · No ✔ Where does your code run? · node/browser (repro’ed with both) ✔ How would you like to define a style for your project? · guide ✔ Which style guide do you want to follow? · airbnb ✔ What format do you want your config file to be in? · JavaScript
4. Create index.js with contents:

import foo from "./foo.js";

console.log(foo());

1. Create foo.js with contents:

function foo() {
  return "I'm foo";
}
export default foo;

1. Add "type": "module" to package.json (required for node to work with ESM imports)
2. eslint .

Node version: v14.15.4
npm version: v7.5.2
Local ESLint version: v7.20.0
Global ESLint version: v7.19.0 (Currently used)

What did you expect to happen? eslint to work, or at least to disallow .js format for .eslintrc when ESM is selected on init

What actually happened? Please copy-paste the actual, raw output from ESLint.

Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: /private/tmp/node-app-lint-test/.eslintrc.js
require() of ES modules is not supported.
require() of /private/tmp/node-app-lint-test/.eslintrc.js from /usr/local/lib/node_modules/eslint/node_modules/@eslint/eslintrc/lib/config-array-factory.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename .eslintrc.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from /private/tmp/node-app-lint-test/package.json.

    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1080:13)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at module.exports (/usr/local/lib/node_modules/eslint/node_modules/import-fresh/index.js:32:59)
    at loadJSConfigFile (/usr/local/lib/node_modules/eslint/node_modules/@eslint/eslintrc/lib/config-array-factory.js:225:16)
    at loadConfigFile (/usr/local/lib/node_modules/eslint/node_modules/@eslint/eslintrc/lib/config-array-factory.js:309:20)
    at ConfigArrayFactory.loadInDirectory (/usr/local/lib/node_modules/eslint/node_modules/@eslint/eslintrc/lib/config-array-factory.js:502:34)
    at CascadingConfigArrayFactory._loadConfigInAncestors (/usr/local/lib/node_modules/eslint/node_modules/@eslint/eslintrc/lib/cascading-config-array-factory.js:379:46)
    at CascadingConfigArrayFactory.getConfigArrayForFile (/usr/local/lib/node_modules/eslint/node_modules/@eslint/eslintrc/lib/cascading-config-array-factory.js:300:18)

The problem can be resolved by changing the .eslintrc format to json; exporting the .eslintrc object using the ESM format in .eslintrc.js doesn’t work.

Are you willing to submit a pull request to fix this bug? I’m willing to try!

[iliiliili]

I just replace .eslintrc.js with .eslintrc.json and now it works 🤔

[mdjermanovic]

Hi @HartS, thanks for the issue!

Can you rename the created config file to .eslintrc.cjs and try again?

I think we could update the --init command to read package.json, and if it has "type": "module" then create .eslintrc.cjs instead of .eslintrc.js.