CodeSandbox editor has stopped auto completing the corresponding JSX closing tags?

Question

CodeSandbox editor used to auto generate the corresponding close tag for the current tag.

For example:

<div> // THEN IT WOULD AUTO GENERATE THE </div> TAG

But don't know exactly when, it stopped doing that, and I have to write it manually. Is there a way to enable this autocomplete again?

score 22 · Accepted Answer · answered Sep 28 '20 at 04:07

22

In the codesandbox.io go to:

File -> Preferences -> Settings

In the Search Settings box type Javascript Autoclosing Tags.

Enable that feature by checking the Checkbox.

answered Sep 28 '20 at 04:07

Luis

2

You also have to turn Emmet back on - for autocompleting tag and component names. Not sure when, or why, this was removed from the default behavior when it's the default behavior of just about every other editor. – PhillipKregg Dec 18 '20 at 16:37

score 3 · Answer 2 · answered Dec 13 '21 at 20:21

Just posting an updated answer since the UI has changed for codesandbox. I believe this answer is now slightly better:

Press cmd+, (ctrl+, on a windows) with the editor focused (this opens the vscode settings)
You should see a settings page like so:
In the Search Settings box type Javascript Autoclosing Tags
Toggle the checkbox on

score 2 · Answer 3 · answered Dec 03 '21 at 19:15

2

In my case the auto completion works if a change the extension of the file to .jsx and if I start typing the tag without the <.

answered Dec 03 '21 at 19:15

Marcos

You may have to go into settings>User Settings>Extensions>Emmet and enable "Trigger Expansion On Tab." That was my problem. That's the only way I know how to use Emmet is by Tab. – Chris Kavanagh Feb 20 '22 at 00:42

3 Answers3