Improving JSX editing in Visual Studio 2017

Question

Is there a way to improve JSX editing in Visual Studio 2017?

Here are my main concerns:

• VS 2017 does NOT automatically close the HTML tags that I open in JSX files. For example, I open a new <div> , and VS 2017 does nothing. I would like it to automatically close it for me.
• As you create more and more HTML elements inside JSX, you wonder what tag closes what - especially in the case of <div> tags. Just as with curly braces, it would be nice to click a tag and see its opening / closing tag. When I click on the <div> in my JSX file, VS 2017 highlights ALL other DIVs. This is not very helpful. I would prefer to see the corresponding open / close tag - see below:

Any suggestions on how I can improve my JSX editing experience?

PS Please DO NOT suggest me switch to VS code or some other editor. I am a full-stack developer, and I go back and forth between the back-end and front-end when I write my code or debug it. Switching between editors didn't make sense to me. I like what VS 2017 gives me, and I just need to improve the experience a bit.

In addition, I already installed Web Essentials 2017, which did not really address these issues.

Answer 1

In Visual Studio code, I use to add an external auto-close-tag plugin. VS2017 says it supports unofficial plugins. Therefore, I understand that he will also support this. Since I do not have 2017, I cannot verify this.