How to solve React 17 New JSX error in VSCode

React v17 introduced the new JSX concept.

If you are using Visual studio code, you may have this error:

Cannot use JSX unless the '--jsx' flag is provided.

The problem is VSCode is using typescript version 4.0.3 but actually react-jsx requires 4.1 or more.

You should specify the typescript path that your project is using.

Press ctrl + , to go to Settings and look for typescript.tsdk

TypeScript: Tsdk Specifies the folder path to the tsserver and lib*.d.ts files under a TypeScript install to use for IntelliSense, for example: ./node_modules/typescript/lib.

In my case I was working on a monorepo project with vscode workspace:

{
  "settings": {
    "typescript.tsdk": "..\\node_modules\\typescript\\lib"
  }
}

after that you can click on typescript the status bar (at the bottom of VSCode) and choose the version that you've been sat.