../../.eslintrc.json#overrides[0]': Class extends value undefined is not a constructor or null

I still get the following error with latest versions of everything after updating Angular v13.

Failed to load plugin '@nrwl/nx' declared in 'apps/XXX/.eslintrc.json » ../../.eslintrc.json#overrides[0]': Class extends value undefined is not a constructor or null

apps/XXX/.eslintrs.json

{
  "extends": "../../.eslintrc.json",
  "overrides": [
    {
      "files": ["*.ts"],
      "rules": {
        ...
      }
    }
  ]
}

root .eslintrc.json

{
  "root": true,
  "plugins": [
    "@angular-eslint",
    "@nrwl/nx",
    "@typescript-eslint",
    "import",
    "no-use-extend-native",
    "prefer-arrow",
    "unicorn",
    "simple-import-sort",
    "unused-imports"
  ],
  "overrides": [
    {
      "files": ["*.ts"],
      "parserOptions": {
        "project": ["tsconfig.*?.json"],
        "createDefaultProgram": true
      },
      "extends": [
        "eslint:recommended",
        "plugin:@typescript-eslint/eslint-recommended",
        "plugin:@typescript-eslint/recommended",
        "plugin:@angular-eslint/recommended",
        "plugin:@nrwl/nx/typescript",
        "plugin:import/errors",
        "plugin:import/warnings",
        "plugin:unicorn/recommended",
        "plugin:compat/recommended",
        "plugin:prettier/recommended",
        "plugin:jest/recommended",
        "plugin:jest/style"
      ],
      "rules": {
        ...
      }
    },
    ...
  ]
}

"dependencies": {
    "@angular/animations": "13.0.2",
    "@angular/cdk": "13.0.2",
    "@angular/common": "13.0.2",
    "@angular/compiler": "13.0.2",
    "@angular/core": "13.0.2",
    "@angular/forms": "13.0.2",
    "@angular/material": "13.0.2",
    "@angular/platform-browser": "13.0.2",
    "@angular/platform-browser-dynamic": "13.0.2",
    "@angular/router": "13.0.2",
    "@datorama/akita": "6.2.4",
    "@datorama/akita-ng-router-store": "6.0.2",
    "@datorama/akita-ngdevtools": "6.0.1",
    "@ngneat/forms-manager": "2.5.0",
    "@ngrx/effects": "13.0.1",
    "@ngrx/router-store": "13.0.1",
    "@ngrx/store": "13.0.1",
    "@ngx-translate/core": "14.0.0",
    "@ngx-translate/http-loader": "7.0.0",
    "bootstrap": "4.6.1",
    "core-js": "3.19.1",
    "datebook": "7.0.7",
    "dayjs": "1.10.7",
    "ngx-quill": "16.0.1",
    "quill": "1.3.7",
    "rxjs": "7.4.0",
    "tslib": "2.3.1",
    "uuid": "8.3.2",
    "zone.js": "0.11.4"
  },
  "devDependencies": {
    "@angular-builders/custom-webpack": "13.0.0",
    "@angular-devkit/architect": "0.1300.3",
    "@angular-devkit/build-angular": "13.0.3",
    "@angular-devkit/core": "13.0.3",
    "@angular-devkit/schematics": "13.0.3",
    "@angular-eslint/builder": "13.0.1",
    "@angular-eslint/eslint-plugin": "13.0.1",
    "@angular-eslint/eslint-plugin-template": "13.0.1",
    "@angular-eslint/schematics": "13.0.1",
    "@angular-eslint/template-parser": "13.0.1",
    "@angular/cli": "13.0.3",
    "@angular/compiler-cli": "13.0.2",
    "@angular/language-service": "13.0.2",
    "@jest/console": "27.3.1",
    "@jest/core": "27.3.1",
    "@jest/environment": "27.3.1",
    "@jest/fake-timers": "27.3.1",
    "@jest/reporters": "27.3.1",
    "@jest/test-result": "27.3.1",
    "@ngneat/spectator": "9.0.0",
    "@ngrx/schematics": "13.0.1",
    "@ngrx/store-devtools": "13.0.1",
    "@nrwl/angular": "13.2.2",
    "@nrwl/cli": "13.2.2",
    "@nrwl/eslint-plugin-nx": "13.2.2",
    "@nrwl/jest": "13.2.2",
    "@nrwl/linter": "13.2.2",
    "@nrwl/nx-cloud": "12.5.4",
    "@nrwl/storybook": "13.2.2",
    "@nrwl/tao": "13.2.2",
    "@nrwl/workspace": "13.2.2",
    "@storybook/addon-actions": "6.3.0-alpha.29",
    "@storybook/addon-backgrounds": "6.3.0-alpha.29",
    "@storybook/addon-knobs": "6.3.0-alpha.21",
    "@storybook/angular": "6.3.0-alpha.29",
    "@storybook/builder-webpack5": "6.2.9",
    "@types/jest": "27.0.3",
    "@types/jest-when": "2.7.3",
    "@types/node": "16.11.9",
    "@types/uuid": "8.3.3",
    "@types/webpack": "5.28.0",
    "@typescript-eslint/eslint-plugin": "5.4.0",
    "@typescript-eslint/parser": "5.4.0",
    "canvas": "2.8.0",
    "cross-env": "7.0.3",
    "dotenv": "10.0.0",
    "eslint": "8.3.0",
    "eslint-config-prettier": "8.3.0",
    "eslint-import-resolver-typescript": "2.5.0",
    "eslint-plugin-compat": "4.0.0",
    "eslint-plugin-import": "2.25.3",
    "eslint-plugin-jest": "25.3.0",
    "eslint-plugin-no-use-extend-native": "0.5.0",
    "eslint-plugin-prefer-arrow": "1.2.3",
    "eslint-plugin-prettier": "4.0.0",
    "eslint-plugin-simple-import-sort": "7.0.0",
    "eslint-plugin-unicorn": "39.0.0",
    "eslint-plugin-unused-imports": "2.0.0",
    "husky": "7.0.4",
    "jasmine-marbles": "0.8.4",
    "jest": "27.3.1",
    "jest-canvas-mock": "2.3.1",
    "jest-extended": "1.1.0",
    "jest-html-reporters": "2.1.6",
    "jest-junit": "13.0.0",
    "jest-message-util": "27.3.1",
    "jest-preset-angular": "11.0.1",
    "jest-runner": "27.3.1",
    "jest-runtime": "27.3.1",
    "jest-sonar": "0.2.12",
    "jest-when": "3.4.2",
    "js-beautify": "1.14.0",
    "lint-staged": "12.1.2",
    "mkdirp": "1.0.4",
    "mockdate": "3.0.5",
    "ng-mocks": "12.5.0",
    "ngx-markdown": "13.0.0",
    "patch-package": "6.4.7",
    "prettier": "2.4.1",
    "prettier-eslint": "13.0.0",
    "rimraf": "3.0.2",
    "rxjs-marbles": "7.0.1",
    "source-map-explorer": "2.5.2",
    "stylelint": "14.1.0",
    "stylelint-config-idiomatic-order": "8.1.0",
    "stylelint-config-prettier": "9.0.3",
    "stylelint-config-sass-guidelines": "9.0.1",
    "stylelint-config-standard": "24.0.0",
    "stylelint-declaration-block-no-ignored-properties": "2.5.0",
    "stylelint-no-unsupported-browser-features": "5.0.2",
    "stylelint-order": "5.0.0",
    "stylelint-prettier": "2.0.0",
    "stylelint-scss": "4.0.0",
    "stylelint-use-nesting": "3.0.0",
    "svg-to-ts": "6.0.1",
    "timezone-mock": "1.2.2",
    "ts-jest": "27.0.7",
    "ts-node": "10.4.0",
    "type-fest": "1.2.2",
    "typescript": "4.4.4"
  }

[bsara]

@nzacca thanks for the clarification.

requires you to upgrade to Angular 13.

That’s unfortunate for me I guess. We still need to support IE 11 😢

[nzacca]

@bsara This package angular-eslint is not geared toward a specific framework but the fix does need to be ported to a version of angular-eslint that supports Angular 12. As per my comment above, I don’t know if that port will ever happen.

Based on the release notes here, version 8 of eslint is only supported by v13+ of angular-eslint which requires you to upgrade to Angular 13.

Cheers!