Definitelytyped: [@types/react] Property 'Component' does not exist on type 'typeof React'.

Created on 30 Nov 2018  路  4Comments  路  Source: DefinitelyTyped/DefinitelyTyped

Just recently started a project with create-react-app, and I am getting a [ts] error in vscode:

Property 'Component' does not exist on type 'typeof React'
  • [x] I tried using the @types/xxxx package and had problems.
  • [x] I tried using the latest stable version of tsc. https://www.npmjs.com/package/typescript
  • [x] I have a question that is inappropriate for StackOverflow.
  • [x] (Please Mention the authors (see Definitions by: in index.d.ts) so they can respond.
    Authors: @johnnyreilly, @bbenezech, @pzavolinsky, @digiguru, @ericanderson, @tkrotoff, @DovydasNavickas, @onigoetz, @theruther4d, @guilhermehubner, @ferdaber, @jrakotoharisoa, @pascaloliv, @Hotell, @franklixuefei, @Kovensky

The dependency versions are below:

  "dependencies": {
    "@types/jest": "23.3.10",
    "@types/node": "10.12.11",
    "@types/react": "16.7.10",
    "@types/react-dom": "16.0.11",
    "react": "^16.6.3",
    "react-dom": "^16.6.3",
    "react-scripts": "2.1.1",
    "typescript": "3.2.1"
  },

The file where I am having this issue is below:

import React from 'react';
import logo from './logo.svg';
import './App.css';

class App extends React.Component {
  render() {
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <p>
            Edit <code>src/App.tsx</code> and save to reload.
          </p>
          <a
            className="App-link"
            href="https://reactjs.org"
            target="_blank"
            rel="noopener noreferrer"
          >
            Learn React
          </a>
        </header>
      </div>
    );
  }
}

export default App;

Also, when I go to index.d.ts, there are 251 [ts] errors.

Most helpful comment

vscode was using an old version of typescript. Once I told it to use the workspace's version, the errors went away.

Hello, same problem here.Could tell me how to update the version that vscode is using ?

image
When you're using your .ts/.tsx vscode will show the version it's using, click it and then choose to use the workspace's version

All 4 comments

vscode was using an old version of typescript. Once I told it to use the workspace's version, the errors went away.

vscode was using an old version of typescript. Once I told it to use the workspace's version, the errors went away.

Hello, same problem here.Could tell me how to update the version that vscode is using ?

vscode was using an old version of typescript. Once I told it to use the workspace's version, the errors went away.

Hello, same problem here.Could tell me how to update the version that vscode is using ?

image
When you're using your .ts/.tsx vscode will show the version it's using, click it and then choose to use the workspace's version

Upgrade @types/react may solve this problem.

Was this page helpful?
0 / 5 - 0 ratings