DEV Community

Cover image for Enable Emmet support for React in VS Code
Joseph Mukorivo
Joseph Mukorivo

Posted on • Edited on • Originally published at josemukorivo.com

Enable Emmet support for React in VS Code

Back in the day in 1965😂(just kidding I mean 2019) when I was writing plain HTML in VS Code I used to work with emmet to be super fast with my markup. I started using react in 2019 and guess what, emmet was not working by default with React in VS Code and I had to write all my mark up one by one with their attributes.

It turned out that Emmet, React and VS Code already had a relationship👨‍👩‍👦 that I didn't know of. You know what🤔 Let me just show you how to enable it in VS Code.

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

Alt Text

Photo by Michael Dziedzic on Unsplash

Top comments (7)

Collapse
 
aderchox profile image
aderchox

Or add this in settings.json:

"emmet.includeLanguages": {
  "javascript": "javascriptreact",
  "typescript": "typescriptreact"
}
Enter fullscreen mode Exit fullscreen mode
Collapse
 
bashirartin profile image
Bashir Shahbakhsh

Thanks 🙏

Collapse
 
motosharpley profile image
Bryan

awesome straight to the point with exactly what I was looking for Thanks!

Collapse
 
kouroshjs profile image
Kourosh Eidivandi

Thank You!

Collapse
 
stardust2stardust profile image
stardust2stardust

Thank you!

Collapse
 
treanaslocum profile image
Treana Slocum

Thanks this really helped.

Collapse
 
carloshenriquemkt profile image
Carlos Henrique

Thanks!!