DEV Community

Žane Suhadolnik
Žane Suhadolnik

Posted on

How to use Emmet with React/JSX?

Hi, hello, dober dan!

This isn't a tutorial sadly, more of a request for knowledge :D

Been learning React recently. As probably many of you I also use Emmet when it comes to writing HTML code more quickly. I wanted to use Emmet for JSX and found myself confused as to why it doesn't work consistently?

First thing I did was change the "Workplace settings" in VSCode as how this issue instructed:

That worked, BUT when I created a new .js file in my src folder for example and tried writing React/JSX code in it, Emmet didn't work. The only solution I could figure out was to manually change the file type to javascriptreact every time I create a new file.

Does anyone have a link to a solution? Thanks :D

Top comments (5)

mksdziag profile image
mksdziag • Edited

For me answer from works perfectly

// add to your vscode settings
"files.associations": {
"*.js": "javascriptreact"

emmanuel112673 profile image

Thank you

zasuh_ profile image
Žane Suhadolnik

Thank you!

defman profile image
Sergey Kislyakov

Isn't jsx supposed to contain JSX/JS and JS to contain JS only?

qoobes profile image
Ahmed Haracic

Yes, but it's still not used in most cases.