eslint 错误 '$localize' 没有为 angular 项目定义

Question

I added localization to my angular 15 project (which works). But linting now is broken for .ts files:

error '$localize' is not defined no-undef

Here's the .eslintrc.json :

{
  "root": true,
  "ignorePatterns": [
    "projects/**/*"
  ],
  "env": {
    "browser": true
  },
  "overrides": [
    {
      "files": [
        "*.ts"
      ],
      "parserOptions": {
        "project": [
          "tsconfig.json"
        ],
        "createDefaultProgram": true
      },
      "extends": [
        "eslint:recommended",
        "plugin:@angular-eslint/recommended",
        "plugin:@angular-eslint/template/process-inline-templates",
        "plugin:prettier/recommended"
      ],
      "rules": {
        "@angular-eslint/directive-selector": [
          "error",
          {
            "type": "attribute",
            "prefix": "ilg",
            "style": "camelCase"
          }
        ],
        "@angular-eslint/component-selector": [
          "error",
          {
            "type": "element",
            "prefix": "ilg",
            "style": "kebab-case"
          }
        ],
        "@typescript-eslint/consistent-type-assertions": [
          "error",
          {
            "assertionStyle": "as"
          }
        ],
        "max-statements-per-line": [
          "error",
          {
            "max": 1
          }
        ],
        "constructor-super": "error",
        "no-unused-vars": "off"
      }
    },
    {
      "files": [
        "*.ts"
      ],
      "parser": "@typescript-eslint/parser",
      "parserOptions": {
        "ecmaVersion": 2019,
        "project": "./tsconfig.json",
        "sourceType": "module"
      },
      "plugins": [
        "ngrx"
      ],
      "rules": {
        "@ngrx/updater-explicit-return-type": "warn",
        "@ngrx/no-dispatch-in-effects": "warn",
        "@ngrx/no-effects-in-providers": "error",
        "@ngrx/prefer-action-creator-in-of-type": "warn",
        "@ngrx/prefer-concat-latest-from": "warn",
        "@ngrx/prefer-effect-callback-in-block-statement": "warn",
        "@ngrx/use-effects-lifecycle-interface": "warn",
        "@ngrx/avoid-combining-selectors": "warn",
        "@ngrx/avoid-dispatching-multiple-actions-sequentially": "warn",
        "@ngrx/avoid-duplicate-actions-in-reducer": "warn",
        "@ngrx/avoid-mapping-selectors": "warn",
        "@ngrx/good-action-hygiene": "warn",
        "@ngrx/no-multiple-global-stores": "warn",
        "@ngrx/no-reducer-in-key-names": "warn",
        "@ngrx/no-store-subscription": "warn",
        "@ngrx/no-typed-global-store": "warn",
        "@ngrx/on-function-explicit-return-type": "warn",
        "@ngrx/prefer-action-creator-in-dispatch": "warn",
        "@ngrx/prefer-action-creator": "warn",
        "@ngrx/prefer-inline-action-props": "warn",
        "@ngrx/prefer-one-generic-in-create-for-feature-selector": "warn",
        "@ngrx/prefer-selector-in-select": "warn",
        "@ngrx/prefix-selectors-with-select": "warn",
        "@ngrx/select-style": "warn",
        "@ngrx/use-consistent-global-store-name": "warn"
      }
    },
    {
      "files": [
        "*.html"
      ],
      "extends": [
        "plugin:@angular-eslint/template/recommended"
      ],
      "rules": {}
    },
    {
      "files": [
        "*.ts"
      ],
      "extends": [
        "plugin:@ngrx/strict-requiring-type-checking"
      ]
    }
  ]
}

polyfills.ts contains the import for localize:

import "@angular/localize/init";

Please help me fix this as I couldn't find anything myself.

Answer 1

I added the following to .eslintrc.json for now:

  "globals": {
    "$localize": "readonly"
  },