Bug: eslint v8 with flat config and airbnb-base throws cryptic error

[gingkapls]

Environment

Node version: v20.12.2
npm version: 10.5.0
Local ESLint version: v8.5.7
Global ESLint version: -
Operating System: Linux / NixOS 24.05

What parser are you using?

Default (Espree)

What did you do?

Configuration

import globals from "globals";

import path from "path";
import { fileURLToPath } from "url";
import { FlatCompat } from "@eslint/eslintrc";
import pluginJs from "@eslint/js";

// mimic CommonJS variables -- not needed if using CommonJS
const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);
const compat = new FlatCompat({baseDirectory: __dirname, recommendedConfig: pluginJs.configs.recommended});

export default [
  {languageOptions: { globals: globals.browser }},
  ...compat.extends("airbnb-base"),
];

class Rectangle {
  #height = 0;
  #width;

  constructor(height, width) {
    this.#height = height;
    this.#width = width;
  }
}

What did you expect to happen?

It should complain only about unused variables and lack of linebreaks between class members.

What actually happened?

It throws a cryptic error stating
2:3 error Parsing error: Unexpected character '#' referring to the first private property of the class.

Link to Minimal Reproducible Example

https://github.com/gingkapls/eslint-issue-minimal

Participation

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

Additional comments

Commenting out the ...compat.extends("airbnb-base"), from the configuration file fixes the issue.
Perhaps FlatCompat class is not working properly.

The configuration was created using npm init @eslint/config and choosing the options for
chose the following options:

• check syntax, find problems and enforce style
• use ES modules
• no framework
• no typescript
• browser runtime
• airbnb styleguide

This behaviour is peculiar since there is a warning when trying to use airbnb-base with eslint v9, but there's no such warning for running it with a flat config on eslint v8, especially when it's provided as an option during the recommend way of installing.

[nzakas]

As the message indicates, this is a parsing error, which means that ESLint is not properly configured to accept the latest syntax.

Most likely is that airbnb-base has different versions for ESLint 8 vs. ESLint 9.

In either case, you'll need to contact the maintainers of that plugin for help.

[gingkapls]

Looking at the airbnb repo, there seems to be ongoing work to push an update to add combined support for eslint v7, v8 and v9 as well. Perhaps that will address the parsing issue.

Thank you!