ESlint SyntaxError: Failed to load plugin '@angular-eslint' declared in '.eslintrc.json#overrides[0]': Unexpected token '??='

Question

I have clean(with only eslint and prettier) angular 16 project and this package.json. My IDE showing me a error, screenshot on post footer. In a project with a lower version of angular, this error does not exist.

{
  "name": "my-app",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "watch": "ng build --watch --configuration development",
    "test": "ng test",
    "lint": "ng lint"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^16.0.0",
    "@angular/common": "^16.0.0",
    "@angular/compiler": "^16.0.0",
    "@angular/core": "^16.0.0",
    "@angular/forms": "^16.0.0",
    "@angular/platform-browser": "^16.0.0",
    "@angular/platform-browser-dynamic": "^16.0.0",
    "@angular/router": "^16.0.0",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.13.0"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^16.0.0",
    "@angular-eslint/builder": "16.0.1",
    "@angular-eslint/eslint-plugin": "16.0.1",
    "@angular-eslint/eslint-plugin-template": "16.0.1",
    "@angular-eslint/schematics": "16.0.1",
    "@angular-eslint/template-parser": "16.0.1",
    "@angular/cli": "~16.0.0",
    "@angular/compiler-cli": "^16.0.0",
    "@types/jasmine": "~4.3.0",
    "@typescript-eslint/eslint-plugin": "5.59.2",
    "@typescript-eslint/parser": "5.59.2",
    "eslint": "^8.39.0",
    "eslint-config-prettier": "^8.8.0",
    "eslint-plugin-prettier": "^4.2.1",
    "jasmine-core": "~4.6.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.2.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.0.0",
    "prettier": "^2.8.8",
    "prettier-eslint": "^15.0.1",
    "typescript": "~5.0.2"
  }
}

eslintrc

{
  "root": true,
  "ignorePatterns": [
    "projects/**/*"
  ],
  "overrides": [
    {
      "files": [
        "*.ts"
      ],
      "extends": [
        "eslint:recommended",
        "plugin:@typescript-eslint/recommended",
        "plugin:@angular-eslint/recommended",
        "plugin:@angular-eslint/template/process-inline-templates"
      ],
      "rules": {
        "@angular-eslint/directive-selector": [
          "error",
          {
            "type": "attribute",
            "prefix": "app",
            "style": "camelCase"
          }
        ],
        "@angular-eslint/component-selector": [
          "error",
          {
            "type": "element",
            "prefix": "app",
            "style": "kebab-case"
          }
        ]
      }
    },
    {
      "files": [
        "*.html"
      ],
      "extends": [
        "plugin:@angular-eslint/template/recommended",
        "plugin:@angular-eslint/template/accessibility"
      ],
      "rules": {}
    }
  ]
}

and i have this problem

where is error?

clean project. I suspect that the problem is in the version of some package, but I can not figure out which one

Answer 1

Angular ESLint v16 dropped support for Node v14, as stated in their release notes. I was able to reproduce the error in a Node 14 environment.

To fix the error, install Node v16.13.0 or higher on your system. Also check your IDE settings so it uses the correct Node version.