Ari K
Ari K

Reputation: 515

VS Code - Turn off auto close tags, but leave on autocomplete

Recently switched from Sublime Text 3 to VS Code. Overall pleased with the switch except for this one little thing that's just annoying enough to be a dealbreaker if there's no solution. In ST3 if I type, say, a <div>, it doesn't automatically drop in a </div>, which is nice because I'm often pasting it in and don't want it closed right there.

What ST3 DOES do, however, is complete the tag the moment I type </. It autofills div> the moment I type the forward slash. This is the behavior I want from VS Code. I can't find any mention of this anywhere which is completely baffling. I know how to autoclose tags, but that's no good becasue then I have to manually close them. I want VS Code, like ST3, to autocomplete the tag for me, just not immediately.

Upvotes: 49

Views: 43930

Answers (5)

To get this behaviour, install the Add Close Tags extension and then add this to settings.json to make it work like Sublime Text:

"html.autoClosingTags": false,
"auto-close-tag.SublimeText3Mode": true,
"auto-close-tag.activationOnLanguage": [ "html" ]

If you want this behaviour for PHP, xml, etc. also add those languages to that last settings.

Upvotes: 6

Marquez
Marquez

Reputation: 6039

Go to Settings, search for "auto closing" and enable/disable these options as needed

Auto closing settings in VS Code

Or set them in your settings.json file like so:

"html.autoClosingTags": false,
"typescript.autoClosingTags": false,
"javascript.autoClosingTags": false,

Upvotes: 4

Andrew Mititi
Andrew Mititi

Reputation: 1153

A very simple trick i learnt

If you want to disable tags auto completion for just a single task for example. To save a file without vscode adding closing tags. Just set a different language mode for that file.
Change from the inferred one i.e html to Batch, Diff ignore. The options on vscode are many. This will enable you to save the file without addition of any closing tags.
After you are remember to reset the language mode to Auto Detect.

TLDR; To access language mode-:

  • Use the command pallete and search Change Language Mode or
  • Find a shortcut at the bottom right section on Vscode.

Upvotes: 0

NotTheWaquar
NotTheWaquar

Reputation: 176

On Windows/Linux - Ctrl + Shift + P

On MacOS - Cmd + Shift + P

In the search box type settings.json

paste the following line there

"html.autoClosingTags": false

Upvotes: 1

Phiter
Phiter

Reputation: 14982

Go to File > Preferences > Settings, search for html.autoClosingTags and set it to false.

This will make it so when you type <div>, it won't insert </div> automatically, but if you start typing </, it won't close the tag automatically. You can press ENTER to make it autocomplete for you.

Or you can leave this option enabled and when you type <div> and it autocompletes, you can just press CTRL + Z.

More information on this behavior here.

Upvotes: 67

Related Questions