Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Broken eslint rule configuration for typescript with CRA 3.* #6986

Closed
olee opened this issue May 5, 2019 · 4 comments · Fixed by #6987
Closed

Broken eslint rule configuration for typescript with CRA 3.* #6986

olee opened this issue May 5, 2019 · 4 comments · Fixed by #6987

Comments

@olee
Copy link

olee commented May 5, 2019

Using create-react-app version 3.* with typescript breaks compilation on certain linting rules and even crashes in some cases.
The reason for that is an incorrect eslint rule configuration which is not compatible with https://github.com/typescript-eslint/typescript-eslint

Case 1

Using an overloaded constructor definition in a typescript class like will throw an exception from eslint:

class Case1 {
    constructor(a: number, b: string);
    constructor(b: string);
    constructor(aOrB: string | number, b?: string) {
        if (typeof aOrB === 'number') {
            console.log('variant 1 called with b = ' + b);
        } else {
            console.log('variant 2 called with b = ' + aOrB);
        }
    }
}

Result

eslint will throw the following exception:

TypeError: Cannot read property 'body' of null
Occurred while linting <my test file>
    at Array.forEach (<anonymous>)
    at Array.forEach (<anonymous>)
    at Array.map (<anonymous>)

Solution

This issue was reported here typescript-eslint/typescript-eslint#420
The solution to this problem is to disable no-useless-constructor and enable @typescript-eslint/no-useless-constructor

Case 2

Using an overloaded class method generates invalid warnings from eslint

Example:

class Case2 {
    public test(a: number, b: string): void;
    public test(b: string): void;
    public test(aOrB: string | number, b?: string): void {
        if (typeof aOrB === 'number') {
            console.log('variant 1 called with b = ' + b);
        } else {
            console.log('variant 2 called with b = ' + aOrB);
        }
    }
}

Result

  Line 3:  Duplicate name 'test'                     no-dupe-class-members
  Line 4:  Duplicate name 'test'                     no-dupe-class-members

Solution

The rule no-dupe-class-members should be disabled for typescript linting because typescript compiler already does that: typescript-eslint/typescript-eslint#291

Notes

I suspect there might be more cases like these, however these are the ones which have been found until now.

See #6871

@ianschmitz
Copy link
Contributor

Case 1 was already fixed by #6862.

Case 2 will be fixed by #6987.

Thanks for reporting! Please let us know if you find any other rules that are conflicting with TypeScript's type checking. It is difficult for us to test all the possibilities.

@olee
Copy link
Author

olee commented May 5, 2019

Is there an estimate when a build with these fixes will be published to npm?
Would be nice to get this out asap.

@gaearon
Copy link
Contributor

gaearon commented May 5, 2019

Since 3.0 was a major release and updating to it is something you do intentionally, it seems like this can wait at least until the work week? It's the weekend now.

@olee
Copy link
Author

olee commented May 5, 2019

Of course - just wanted to know if releases can take some weeks or if such fixes are published quickly.
So sometime next week is perfect 👍

@lock lock bot locked and limited conversation to collaborators May 12, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants