Amala James
Amala James

Reputation: 1486

How can i write React.js code in Visual Studio code?

When i write react code in Visual Studio Code, it is showing me error. How can i get rid of those errors?

Thanks in Advance,

Amala

Upvotes: 1

Views: 4220

Answers (4)

twumm
twumm

Reputation: 395

I had the same issue and I fixed it by saving the file as a .jsx.

I tried all the suggestions here but none works if the file is saved as a .js(which I think is what you are experiencing).

I am hoping a better fix is available somewhere as at this time.

Upvotes: 0

raphie
raphie

Reputation: 3305

First make sure you have installed all extensions for VS Code for proper code coloring and hitting for React.js, I think React-Native extensions work as well.

If you have npm installed in your system install eslint

npm install -g eslint

There is a cool add on to configure eslint to properly hitting JSX and you need to install it in your project directory. Go to your project directory on the terminal, or open the internal terminal on VS Code with the project open and type in:

npm install --save eslint-config-rallycoding

After this package is installed I suggest to create a .eslintrc file on the root of your project. This should be a proper JSON formatted code:

{
    "extends": "rallycoding"
}

save the file and then restart VSCode, just in case. This should fix those errors. The ESLint configuration package belongs to Stephen Grider, pretty sure is open source, but giving credit just in case, and I found it on a real nice tutorial on React-Native and Redux.

The Complete React Native and Redux Course

Upvotes: 0

Faraz Ahmed
Faraz Ahmed

Reputation: 1607

Step 1 :

Press Ctrl Shift X
It shows Extensions Screen.

Or

navigate to Extensions Screen manually

Step 2 :

Search for jsx Extension. and after result comes install Extension with name jsx.

then visual Studio code not showing error on html element.

Upvotes: 0

manish
manish

Reputation: 956

Go to File-> Preferences -> Workspace Settings

Then enter the following lines in settings.json file

{
    "javascript.validate.enable": false
}

Upvotes: 2

Related Questions