ESLint not reporting TypeScript compiler type checking errors

Question

Looking for help in getting the type errors, reported by the TypeScript compiler, into the output of ESLint. The library typescript-eslint (https://github.com/typescript-eslint/typescript-eslint/blob/master/docs/getting-started/linting/TYPED_LINTING.md) makes me think that this should be possible.

File structure

src/
  ... source files
  tsconfig.json
test/
  ... testing files
.eslintrc.js
package.json
tsconfig.json (symlink to src/tsconfig.json)

.eslintrc.js

module.exports = {
  'env': {
    'jest': true,
    'node': true,
  },
  'extends': [
    'airbnb-typescript/base',
    'plugin:@typescript-eslint/eslint-recommended',
    'plugin:@typescript-eslint/recommended',
    'plugin:@typescript-eslint/recommended-requiring-type-checking',
    'plugin:jest/recommended',
  ],
  'parser': '@typescript-eslint/parser',
  'parserOptions': {
    'project': ['./tsconfig.json'],
    'tsconfigRootDir': __dirname,
  },
  'plugins': [
    '@typescript-eslint',
    'jest',
  ],
  'root': true,
};

package.json

{
  "name": "...",
  "version": "...",
  "description": "...",
  "scripts": {},
  "devDependencies": {
    "@types/jest": "^25.1.3",
    "@typescript-eslint/eslint-plugin": "^2.21.0",
    "@typescript-eslint/parser": "^2.21.0",
    "eslint": "^6.8.0",
    "eslint-config-airbnb-typescript": "^7.0.0",
    "eslint-plugin-import": "^2.20.1",
    "eslint-plugin-jest": "^23.8.1",
    "jest": "^25.1.0",
    "nock": "^12.0.2",
    "ts-jest": "^25.2.1"
  },
  "dependencies": {
    "@types/node": "^13.7.7",
    "aws-sdk": "^2.630.0",
    "jsonschema": "^1.2.5",
    "typescript": "^3.8.3"
  }
}

The output of ESLint is empty - no errors - but when running the TypeScript compiler, to build the project, there are many errors reported; for instance:

src/file.ts:xx:xx - error TS2339: Property 'body' does not exist on type 'object'.
src/file.ts:xx:xx - error TS2314: Generic type 'Promise<T>' requires 1 type argument(s).
src/filets:xx:xx - error TS7006: Parameter 'err' implicitly has an 'any' type.

Am I missing something in the configuration or is it improper in some way? Or is this not something that is actually possible?

I'd like to get the errors reporting through ESLint because I have the linting errors showing in my editor as I work on the project. I am using Atom (https://atom.io/) but I would also like this to work for VSCode and possibly VIM as well; team members prefer different editors.

I've created a Git repository to illustrate the inconsistency that I am experiencing in hopes that someone can help me configure it correctly. github.com/kalisjoshua/eslint-typescript-type-warnings-example — kalisjoshua
– kalisjoshua, Commented Mar 10, 2020 at 18:45

Mike Lowery · Accepted Answer · 2024-03-20 19:52:39Z

120

+100

Unfortunately ESLint only reports errors from its own linters, it does not report typescript compilation failures. I sympathize with you - in my projects, I use Babel for quicker typescript transpiling, but since Babel doesn't actually check the types (it just removes them), I still need that type checking as a separate lint step.

This blog post https://iamturns.com/typescript-babel/ describes how you can set up a check-types script inside your package.json to perform this linting function, and treat the typescript compiler as a secondary linter. You could even have it run inside the same lint command where you run eslint:

{
  ...
  "scripts": {
    "check-types": "tsc --noemit",
    "eslint": "eslint",
    "lint": "npm run eslint && npm run check-types",
  }

Then you'd set up your continuous integration server to run npm run lint as one of its build steps.

For your editor, there appears to be a Atom plugin for typescript: https://atom.io/packages/atom-typescript
That would be the ideal way to get your typescript errors to show up in your editor. VSCode has this functionality built-in. I primarily use VSCode and it works great!

The last setting I'd recommend for VSCode is to use eslint's "auto fix" feature together with VSCode's eslint plugins, and configure it to run eslint whenever you save the file. You do this inside .vscode/settings.json on a per-project basis:

{
  "editor.codeActionsOnSave": {
    "source.fixAll": true
  }
}

edited Mar 20, 2024 at 19:52

Mike Lowery

2,9184 gold badges35 silver badges45 bronze badges

answered Mar 19, 2020 at 14:02

Gordon Burgett

1,7421 gold badge12 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Maciej Kravchyk Over a year ago

You may prefer to use a semicolon instead of && - npm run eslint; npm run check-types Using && means that if the lint commands outputs errors, the check-types command will not run.

Gordon Burgett Over a year ago

That's very true! However if you use semicolon, you suppress the exit code of the eslint command. So, if eslint fails but check-types succeeds, then your continuous integration script will likely not catch that it failed. So it depends on what you are using it for!

Maciej Kravchyk Over a year ago

Surely, I should probably restate that: "If you want to treat linting errors as warnings use &".

Zorayr Jan 15 at 21:41

Has this changed with TypedLinting? typescript-eslint.io/getting-started/typed-linting

Ahsan Farooq · Accepted Answer · 2022-02-08 09:05:47Z

3

You can use the following to setup reporting TypeScript type-checking errors:

  "scripts": {
     "lint": "eslint src/**/*.{ts,tsx}",
     "lint:fix": "eslint src/**/*.{ts,tsx} --fix",
     "prettify": "prettier --write src/**/*.{ts,tsx}",
     "type-check": "tsc --noEmit",
   },
  "lint-staged": {
     "*.{ts,tsx}": [
       "eslint",
       "prettier --write",
       "git add"
     ]
   },

And finally to run the script to check both linting and type-checking errors, you can use the following command:

yarn type-check && lint-staged

answered Feb 8, 2022 at 9:05

Ahsan Farooq

9879 silver badges12 bronze badges

Collectives™ on Stack Overflow

ESLint not reporting TypeScript compiler type checking errors

2 Answers 2

4 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related