Nest Comments

🎉 Version 2.0 with CSS syntax support for VSCode Released 🎉

Read more.

Details

The problem: if your code contains a comment, and you want to add a new comment to temporarily disable a block or portion of code, the built in commenting functionality does not actually place the comment tags in expected locations. If an existing comment is included in the content being commented out, the first instance of a --> closing comment tag will end the entire comment.

example HTML code with comment issues
Sublime Text sample of HTML comment issue.

The solution: The plugin very simply finds all comments within the highlighted block of code and converts dashes to tildes, and then places the comment tags in the expected locations. The plugin also then reverses the effect to uncomment the same code.

example HTML code with comment issue solution
Sublime Text nested comments solution.

This plugin/package/extension is available for:

Version 2.0 for VSCode Released

Visual Studio Marketplace Visual Studio Marketplace license

The package has been renamed to Nest Comments, and now supports both the HTML syntax of commenting <!-- --> and the CSS syntax /* */.

HTML Sample

<main role="main">
  <!-- A comment that's very important -->
  <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
</main>

Becomes:

<!-- <main role="main">
<!~~ A comment that's very important ~~>
  <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
</main> -->

CSS Sample

body {
  /* margin: 0; */
}

Becomes:

/* body {
  /~ margin: 0; ~/
} */