Cannot read config file: eslint.config.mjs

[realtril]

Environment

Node version: 18.18.0
npm version: 9.8.1
Local ESLint version: 9.3.0
Global ESLint version: 9.3.0
Operating System: Mac OS

What parser are you using?

@typescript-eslint/parser

What did you do?

Here's my eslint.config.mjs:

import { fileURLToPath } from "url";
import path from "path";
import wcPlugin from "eslint-plugin-wc";
import sonarjsPlugin from "eslint-plugin-sonarjs";
import prettierConfig from "eslint-config-prettier";
import litPlugin from "eslint-plugin-lit";
import airbnbBase from "eslint-config-airbnb-base";
import importPlugin from "eslint-plugin-import";
import eslintCustomRules from "eslint-plugin-eslint-custom-rules"; // Adjust the path based on your actual setup
import { FlatCompat } from "@eslint/eslintrc";

const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);

const compat = new FlatCompat({ resolvePluginsRelativeTo: __dirname });

export default [
  {
    ignores: ["node_modules/**", "dist/**", "buildlocales/**"],
  },
  {
    files: ["**/*.js", "**/*.ts"],
    languageOptions: {
      globals: {
        DEVELOPMENT: true,
        Polymer: true,
        PolymerElement: true,
        window: true,
        localStorage: true,
        top: true,
        Ucs: true
      },
    },
    plugins: {
      wc: wcPlugin,
      sonarjs: sonarjsPlugin,
      lit: litPlugin,
      import: importPlugin,
      "eslint-custom-rules": eslintCustomRules,
    },
    rules: {
      ...prettierConfig.rules,
      ...airbnbBase.rules,
      "import/no-relative-packages": "off",
      "spaced-comment": "off",
      "import/no-cycle": "off",
      "no-multiple-empty-lines": "warn",
      "no-undef": "error",
      "no-console": "off",
      "import/no-extraneous-dependencies": "off",
      "func-names": "off",
      "no-plusplus": "off",
    },
  },
  ...compat.config({
    parser: "@typescript-eslint/parser",
    plugins: ["@typescript-eslint"],
    extends: ["plugin:@typescript-eslint/recommended"],
    rules: {
      "no-undef": "off",
      "@typescript-eslint/no-explicit-any": "off",
      "@typescript-eslint/no-var-requires": "off",
    },
  }),
];

Same error is actually happening even with using default generated .mjs.

Packages versions:

"@typescript-eslint/eslint-plugin": "^7.10.0",
"@typescript-eslint/parser": "^7.10.0",
"eslint": "^9.3.0",
"eslint-config-airbnb-base": "^15.0.0",
"eslint-config-prettier": "^9.1.0",
"eslint-formatter-summary": "^1.1.0",
"eslint-plugin-import": "^2.29.1",
"eslint-plugin-lit": "^1.13.0",
"eslint-plugin-sonarjs": "^1.0.3",
"eslint-plugin-wc": "^2.1.0",
"eslint-webpack-plugin": "^4.1.0"

What did you expect to happen?

Expect to build the app successfully.

What actually happened?

[PluginError: [eslint] Cannot read config eslint.config.mjs
Error: end of the stream or a document separator is expected (20:57)

 17 |  ... ToPath(import.meta.url);
 18 |  ... name(__filename);
 19 |  ... 
 20 |  ... pat({ resolvePluginsRelativeTo: __dirname });
-----------------------------------------^
 21 |  ... 
 22 |  ... ] {
  plugin: 'webpack-stream',
  showProperties: true,
  showStack: false,
  __safety: { toString: [Function: bound ] }
}
[17:08:15] assets by status 9.27 MiB [cached] 3 assets
  
ERROR in [eslint] Cannot read config file: eslint.config.mjs
Error: end of the stream or a document separator is expected (20:57)

 17 |  ... ToPath(import.meta.url);
 18 |  ... name(__filename);
 19 |  ... 
 20 |  ... pat({ resolvePluginsRelativeTo: __dirname });
-----------------------------------------^
 21 |  ... 
 22 |  ... 

webpack 5.76.0 compiled with 1 error and 1 warning

Link to Minimal Reproducible Example

Unfortunately, I don't have any

Participation

• I am willing to submit a pull request for this issue.

Additional comments

No response

[Rec0iL99]

Hi @realtril, thanks for the issue. We do require a minimal reproducible example to evaluate bug reports. Is ESLint CLI able to find the config file? This error does not seem to be from the CLI.

[realtril]

@Rec0iL99 found out that the problem is most probably webpack.config:

      new ESLintPlugin({
        quiet: false,
        failOnError: true,
        outputReport: true,
        overrideConfigFile: paths.eslintrc,
        extensions: ['js', 'ts'], // Add extensions to lint
        exclude: [
          `model`,
          `dist`,
          `node_modules`,
          `buildlocales`
        ]
      }),
      new webpack.DefinePlugin({
        DEVELOPMENT: modes.isDev(type),
      }),
      

Since once this is deleted, my build goes through successfully. Should it be updated ?
I have even tried to add 'process.env.ESLINT_USE_FLAT_CONFIG': JSON.stringify('true'), like

    new webpack.DefinePlugin({
      'process.env.ESLINT_USE_FLAT_CONFIG': JSON.stringify('true'),
      DEVELOPMENT: modes.isDev(type),
    }),

But no luck

[Rec0iL99]

We don't maintain the webpack plugin for ESLint, so the best course of action here is to get help from the plugin maintainers. Closing this now.

[eslint-github-bot]

It looks like there wasn't enough information for us to know how to help you, so we're closing the issue.

Thanks for your understanding.

[eslamwageh]

@realtril did you find any solution for that ?

[Anasnew99]

Can try this?
webpack-contrib/eslint-webpack-plugin#263 (comment)