How to comment out a HTML tag in .Vue 's template

user_14073575 0
Viewed 4958

Recently, I'm start learning Vue and using Vue-Cli. There's a problem that I can not use hot-key(VSCode) to comment out a HTML tag in the . when I use "Ctrl+/" the line I want to comment out turns like this.

// <div> comment out this line</div>

not like this.

<!--<div> comment out this line</div>-->

Is there any possibility that I changed some setting in the VSCode to result this situation? Anyone know how to solve this problem?

vue.js visual-studio-code html javascript
3 Answers

Like tony19 mentioned, installing the Vetur VSCode extension adds Vue language support, which correctly sets up comment toggling in Vue files.

user_44680840

In the template or HTML section use HTML comments

In the script, section use Javascript comments

// Comment /* Comment */

In style section use CSS comments

/* comment */

user_166416600

For single line comment use Ctrl + /. This will do something like this

// <div> comment out this line</div>

and for block comment use Ctrl + Shift + /. This will comment lines like this

<!-- <div> comment out this line</div>

     <div> comment out this line</div>

     <div> comment out this line</div> -->

or

/* <div> comment out this line</div>

   <div> comment out this line</div>

   <div> comment out this line</div> */

In order to change shortcut key

  • Windows: File > Preferences > Keyboard Shortcuts.

  • MacOS: Code > Preferences > Keyboard Shortcuts.

and then search for comment like this Screenshot

user_99244830
Related