Visual studio code comment in HTML files

Question

I am trying Visual Studio Code lately and i've noticed that when i try to add a line comment in an HTML file (using Ctrl+/ or Ctrl+K Ctrl+C) instead of this: <!-- -->, i get this {# #}.

In JS or CSS files the key bindings work just fine and produce the expected result.

So how can i get the proper type of comments in HTML files?

Solution 1

Finally i found what the problem was. I had installed the twig plugin (for the Twig php template engine) and that was causing the comments issue.

Solution 2

I've just installing VSCode 1.1.1 and try to put a comment in an new html file To do so, your new file must be,first, save in .html format and after that, you can use CTRL-K CTRL-C to put a comment and it works.

Hope that help you

Solution 3

For me, it was the (Djaneiro) extension, it made the html files default to django template, so it caused the comments to be wrong in HTML (when pressing ctrl + / ) (commenting them with {% comment %})

Solution 4

If you don't want to disable/uninstall any plugin, you can create a snippet to put a comment. For example, I create a snippet that add HTML comments in a PHP file:

    "comment HTML": {
      "prefix": "chtml",
      "body": ["<!-- $1 -->"],
      "description": "Comment HTML line"
    }

You can insert that right after the comment in File > Preferences > User Snippets > {YourExtension}

Then, when you start typing 'chtml' in that kind of files, IntelliSense will prompt that snippet.

Maybe this is a workarround, but it works excellent for me. Hope it helps!

https://code.visualstudio.com/docs/customization/userdefinedsnippets

Solution 5

List of extensions known to cause this unwanted behavior (Based on my own experience and other answers):

• Hugo Language and Syntax Support
• Djaneiro
• Nunjucks
• Tornado
• Sublime Babel
• Babel
• Twig
• Django by Baptiste Darthenay (v1.0.0)
• (Feel free to edit this answer and add yours)

You may need to restart code after disabling your extension (I did).

View more solutions

Comments

[trivita]

for me, the offender is Jinja syntax support took me a while to do the trial-err

[Jonathan]

For me the offender was Hugo Language and Syntax Support

[Makis K.]

Well i installed the latest version of VSCode 1.1.1 on a new machine and the comments work as expected. But i still have the issue on my other pc (same version 1.1.1 but got it from updates). I think that's maybe a configuration that instead of <!-- --> returns {# #} for HTML files and i want to find that and change it. Or else i 'll try to uninstall and reinstall.

[adripanico]

I was getting crazy about this! Thanks!

[Daniel Tonon]

Thanks :) If you need Twig support, install this extension instead: marketplace.visualstudio.com/…

[Daniel Tonon]

Or maybe this one, it looks like it has more features: marketplace.visualstudio.com/…

[tonix]

I confirm. The problem is with the Twig Language 0.9.0 extension. Use marketplace.visualstudio.com/… and/or marketplace.visualstudio.com/… instead.

[perhelion]

that was not the question dude

[Mindaugas Bernatavičius]

Jinja (by wholroyd) breaks the commenting ability with ctrl + / when inside embedded css.

[MeVR]

This was the issue for me i disabled it , Thanks @tonix