eslint 无法从“@angular/core”中找到 OnInit

Question

this gives an error:

import { Component, OnInit, Input, ViewChild, ElementRef } from "@angular/core";

OnInit not found in '@angular/core'eslintimport/named

The code obviously works, so maybe something in my setup is off?

This is my eslint:

const path = require('path')

module.exports = {
  extends: getExtends(),
  plugins: getPlugins(),
  rules: getRules(),
  parserOptions: getParserOptions(),
  parser: '@typescript-eslint/parser',
  env: getEnv(),
  settings: getSettings(),
}

function getExtends() {
  return [
    'eslint:recommended',
    'plugin:import/errors',
    'plugin:import/warnings',
    'plugin:@typescript-eslint/recommended',
  ]
}

function getPlugins() {
  return ['import', '@typescript-eslint', 'cypress']
}

function getRules() {
  return {
    "@typescript-eslint/no-empty-function": 0,
    '@typescript-eslint/ban-ts-comment': 0,
    '@typescript-eslint/explicit-module-boundary-types': 0,
    '@typescript-eslint/no-explicit-any': 0,
    '@typescript-eslint/no-unsafe-member-access': 0,
    '@typescript-eslint/no-unsafe-call': 0,
    '@typescript-eslint/no-unsafe-assignment': 0,
    'no-unused-vars': 0,
    'import/no-anonymous-default-export': 0,
    'no-console': ['error', { allow: ['warn', 'error', 'info'] }],
    'import/no-named-as-default': 0,
    'import/no-named-as-default-member': 0,
    'prefer-const': 2,
    'no-var': 2,
    '@typescript-eslint/no-unused-vars': [
      'error',
      { vars: 'all', args: 'after-used', ignoreRestSiblings: true },
    ],
    'import/order': [
      'error',
      {
        groups: [
          'builtin',
          'external',
          'internal',
          'index',
          'sibling',
          'parent',
        ],
        'newlines-between': 'always',
      },
    ],
  }
}

function getParserOptions() {
  return {
    ecmaVersion: 12,
    project: [path.resolve(__dirname, 'tsconfig.json')],
  }
}

function getEnv() {
  return {
    es2021: true,
  }
}

function getSettings() {
  return {
    'import/parsers': {
      '@typescript-eslint/parser': ['.ts'],
    },
    'import/resolver': {
      node: {
        extensions: ['.js', '.ts'],
      },
    },
  }
}

and my tsconfig:

{
  "compileOnSave": false,
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "baseUrl": "./",
    "paths": {
      "@ch-common/*": ["src/app/ch-common/*"],
      "@ch-corporate-orders/*": ["src/app/corporate-orders/*"],
      "@ch-time-scheduler/*": ["src/app/time-scheduler/*"],
      "@ch-products/*": ["src/app/products/*"],
      "@ch-events/*": ["src/app/events/*"],
      "@ch-forms/*": ["src/app/forms/*"],
      "@ch-checkout/*": ["src/app/checkout/*"],
      "@ch-wine-club/*": ["src/app/wine-club/*"],
      "@ch-containers/*": ["src/app/containers/*"],
      "@ch-product-offers/*": ["src/app/product-offers/*"],
      "@ch-search-box/*": ["src/app/search-box/*"],
      "@ch-store-reviews/*": ["src/app/store-reviews/*"],
      "@ch-cart/*": ["src/app/cart/*"],
      "@ch-profile-page/*": ["src/app/profile-page/*"],
      "@ch-shared/*": ["src/app/ch-shared/*"],
      "@ch-hivenet-objects/*": ["../app/scripts/hivenet/objects/*"],
      "@ch-tests/*": ["src/test_helpers/*"]
    },
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "module": "es2020",
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "typeRoots": ["node_modules/@types"],
    "lib": ["es2019", "dom"]
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }
}

Answer 1

I solved this witheslint-import-resolver-typescript

and in .eslintrc.json

  "settings": {
    ...

    "import/resolver": {
      "typescript": {
        "alwaysTryTypes": true,
        "project": ["path/to/tsconfig.json"]
      }
    }
  },