ESLint no-unused-var error for DI variables in Angular

Question

I've got an Angular 14.2 Project and I am trying to setup ESLint for it. The problem is that I get false positives for the no-unused-var error and it seems like it only does this for variables which are included via dependency injection in the constructor. I've already googled my a** off, but couldn't find any other solution than turning no-unsued-var completely off, which is not what I want. I want ESLint to still recognize unused variables, but I want to get rid of the false positives.

If anyone has an idea, I'd be really really greatful! <3

  constructor(
    // Used below like this: this.googleAuth.authInit()
    private readonly googleAuth: GoogleAuthService,

    // Used below like this: this.primeConfig.ripple = true
    private readonly primengConfig: PrimeNGConfig,

    // Unused, so ESLint should throw an error
    private messageService: MessageService
  ) {
    this.googleAuth.authInit();

    // Unused, so ESLint should throw an error
    const bla = 'Bla';
  }

This is my .eslintrc.json:

{
  "root": true,
  "ignorePatterns": ["projects/**/*"],
  "overrides": [
    {
      "files": ["*.ts"],
      "parserOptions": {
        "project": ["tsconfig.json"],
        "createDefaultProgram": true
      },
      "extends": [
        "eslint:recommended",
        "plugin:prettier/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"
          }
        ],
        "sort-imports": [
          "error",
          {
            "ignoreCase": true,
            "ignoreDeclarationSort": true,
            "ignoreMemberSort": false,
            "memberSyntaxSortOrder": ["none", "all", "multiple", "single"],
            "allowSeparatedGroups": false
          }
        ]
      }
    },
    {
      "files": ["*.html"],
      "extends": ["plugin:@angular-eslint/template/recommended"],
      "rules": {}
    }
  ]
}

Answer 1

Per this answer, you have to add plugin:@typescript-eslint/recommended