Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Trying to use emmet with a react app in vs code

I am using Visual Studio Code and creating a React App. I understand that Vsc comes with Emmet but it does not work with my React App. I have tried putting the following code in settings.

"emmet.includeLanguages": {
"javascript": "javascriptreact",
"xml": {
  "attr_quotes": "single"
 }
 },
"emmet.triggerExpansionOnTab": true,
like image 515
AltBrian Avatar asked Jun 07 '18 21:06

AltBrian


People also ask

How do I enable Emmet for React in VS Code?

Go to settings > extensions > emmet > include languages and add javascript as the item and javascriptreact as the value.

Can you use Emmet in React?

Easy way to enable emmet for ReactIt's already included for all HTML and CSS files by default in VS code but we need to do some extra configuration to enable it for React. 4. Once opened, add "javascript": "javascriptreact" under “ emmet. includeLanguages ” and save the file.

Does Emmet work with JSX?

The "typescriptreact" option will help Emmet recognize JSX within your . tsx files if you're using React with TypeScript. Now, I like to go a step further and add another line to our settings. json file we opened up earlier.

Does Emmet work in .JS files?

Emmets don't work in JS files. However, you can set it so that VS Code thinks that it's a JSX file and it would give React IntelliSense.


2 Answers

Add this to settings JSON:

"emmet.includeLanguages": {
  "javascript": "javascriptreact"
}
like image 154
Damian Pavlica Avatar answered Sep 21 '22 11:09

Damian Pavlica


In case the marked answer dont work!

In VS Code open settings using command:

On PC: Ctrl + ,

On Mac: Command + ,


Be sure workspace is selected

enter image description here

Search Emmet, scroll down to Emmet Include Language and open settings.JSON file

enter image description here

Paste the following code and save the file. Reload VS CODE and it will work!:

{
  "emmet.includeLanguages": {

    "javascript": "javascriptreact"
  }
}
like image 44
Fareed Khan Avatar answered Sep 22 '22 11:09

Fareed Khan