VS17 Resharper Complaining about React.Component

Question

I have turned on Resharper Ultimate on a .Net Core Web Application that is using TypeScript to code React Components.

So I have a simple component class;

export class Index extends React.Component<{},{}>{

Resharper is warning me that

Generic type '_$_$RsRpExt"FromFile;....\node_modules\@types\react\index.d.ts, module=JavaScriptReferencedFilesModule:Referenced external files".React.Component' requires 1 type argument(s), but got 2

My npm packages for react are;

Dependencies:

"react": "^15.6.1",
"react-dom": "^15.6.1",

Dev Dependencies

"@types/react": "^15.0.39",
"@types/react-dom": "^15.5.1",

Looking at the typed files, I can see that the React Component takes in 2 arguments as it should:

interface Component<P = {}, S = {}> extends ComponentLifecycle<P, S> { }
    class Component<P, S> {
        constructor(props?: P, context?: any);

I am using webpack to compile the TS/TSX files and it is all working and the project works, however it is going to be annoying if Resharper is not playing well with the TypeScript code.

Anyone know a way to resolve this?

Fogdog

Answer 1

The current Resharper version (2017.1) only supports TypeScript 2.2. The React type definitions use generic parameter defaults, which is a TypeScript 2.3 feature and is not recognized properly by Resharper 2017.1. Resharper 2017.2 (currently in EAP) will support TypeScript 2.4.

In the meantime, I just turned off Resharper's JavaScript/TypeScript support (via Resharper => Options => Products and Features) and use the VS TypeScript language support. This works fine.

Cartel

Ahh thanks for the info. I will sit tight and wait for R# v2017.2 then. – Fogdog

Answer 2

In VisualStudio 2019 / Resharper 2019.1 you can now enable JSX syntax in JS files. You can do this by following these steps:

Extensions - Resharper - Options - JavaScript - Inspections - Enable JSX syntax in JS files: Always

I also changed my JavaScript language Level to ECMAScript 2016 but I think that is not necessary.

Purpleness

Very helpful. Thanks for adding your answer. – Mooneyham

Thanks for adding your answer which helped me to get rid of the re-sharper errors perfectly. – Gobbet