How To Setup Intellisense in VSCode for React.js

Ive been getting back into React.js development and was missing the rich developer experience visual studio gives you with things like intellisense.

I thought I had something working as Ctrl+Space opened intellisense with a sensible suggestion, but this turned out to be the IDE using what Id typed earlier to make an educated guess. Clever, but I was hoping for more.

No Intellisense
No Intellisense

Dead Ends

Unfortunately I couldnt find a simple how to guide and the stuff I did get from various github issues and stackoverflow didnt really help.

After several dead ends and lots of hair pulling I eventually got intellisense working using these steps.

How To Setup Intellisense in VSCode for React.js

Step 1 Create a jsconfig.json file

With a project folder open, look in the bottom right and you should see a lightbulb:

VSCode Lightbulb
VSCode Lightbulb

Click the lightbulb, and you should get a popup at the top of the IDE asking if you want to create a jsconfig.json file

Create JSConfig.json
Create JSConfig.json

Click Create jsconfig.json and vscode should do the rest.

Step 2 Install Typings

The Typescript Definition Manager typings should be installed globally with

> npm install typings --global

This will allow you to install typescript definition files which is what well do next.

Step 3 Install React Typescript Definitions

In the folder of the project enter the following commands:

> typings init
> typings install dt~react --global

You should end up with a new typings folder with the following contents:

│   index.d.ts

Step 4 Install typescript

You can install typescript globally, but I prefer to put it in each project with the following command

> npm install typescript@next

Which vscode detects automatically, so theres nothing else to it.

Step 5 Confirm it Works

Now you should be able to see some intellisense for react.js.

VSCode With Intellisense
VSCode With Intellisense


While attempting to get this working I found some what appears to be old and obsolete advice.

  • I havent created a CODE_TSJS or VSCODE_TSJS environment variable
  • There are also a couple places mentioning tsd, but that has been superseded by typings.
  • I dont have (Salsa) in the bottom right of the IDE. In a different setup I had the version number of typescript, but that doesnt appear to be essential.

In all honestly, I dont really know what Im doing, but it appears to work. Hopefully it will work for you too, but please let me know if it doesnt in a comment below or on twitter.

Comments Section