Home > Back-end >  Why is eslint ignoring my strictNullChecks setting?
Why is eslint ignoring my strictNullChecks setting?

Time:11-07

I am trying to port a large existing JavaScript codebase to TypeScript. I have installed typescript, @typescript-eslint/eslint-plugin and @typescript-eslint/parser as devDependencies and configured the project so that tsconfig.json is used.

My (minimal) tsconfig.json is:

{
  "compilerOptions": {
    "target": "es5",
    "module": "esnext",
    "alwaysStrict": true,
    "strict": true,
    "strictNullChecks": true
  },
}

Running eslint on an existing .tsx file (correctly) shows some errors:

$ ./node_modules/.bin/eslint ./src/components/JustSomeComponent.tsx 

/src/components/JustSomeComponent.tsx
   57:75  error    Unexpected empty arrow function 'myFunction'                               @typescript-eslint/no-empty-function
   ...

✖ 20 problems (8 errors, 12 warnings)
  4 errors and 0 warnings potentially fixable with the `--fix` option.

However, I wanted to make sure that strictNullChecks setting was indeed enabled, so I created a new file and made a mistake on purpose:

import React from 'react';

export default class MyComponent extends React.Component {
  render(): React.ReactNode {
    const x: number = null; // I would expect an error here!
    console.log(x);
    return null;
  }
}

But running the check on this file returns no errors:

$ ./node_modules/.bin/eslint ./src/components/MyComponent.tsx
$

Removing the return type for render() method results in an error, so the checks are performed - I am just not warned about invalid null assignements.

Any idea how I can enable strictNullChecks, or at least how to debug why it is disabled?

CodePudding user response:

strictNullChecks is a TypeScript feature, not an ESLint feature.

CodePudding user response:

As @jonrsharpe commented, strictNullChecks is a compiler setting and does not affect eslint.

The reason I wasn't getting any error was that eslint found errors in other files and prevented build from starting. Once I fixed those, build step indeed failed with an error as expected:

$ npm run build

> myapp@0.0.1 build
> react-scripts build

Creating an optimized production build...
Failed to compile.

/src/components/MyComponent.tsx
TypeScript error in /src/components/MyComponent.tsx(5,11):
Type 'null' is not assignable to type 'number'.  TS2322

    3 | export default class MyComponent extends React.Component {
    4 |   render(): React.ReactNode {
  > 5 |     const x: number = null;
      |           ^
    6 |     console.log(x);
    7 |     return null;
    8 |   }
  • Related