嵌套注释 (Nested Comments)

这个VSCode扩展解决了Vue和React项目中嵌套注释的问题，让你能够对已经被注释的代码再次添加注释，并提供了简洁美观的注释样式。

功能特点

在前端开发中，特别是使用Vue和React等框架时，我们经常会遇到这样的问题：当代码已经被注释后，无法再添加额外的注释层级。这是因为HTML/JSX/Vue模板中的注释通常使用  格式，而这种格式不支持嵌套。

这个扩展提供了以下功能：

单键切换注释：一个快捷键完成所有注释操作，循环切换注释状态
简洁美观的注释样式：优化了注释符号，使代码更加整洁
智能注释层级：自动识别当前注释状态，进行适当的操作
多行块注释：选择多行代码时，使用块注释而不是单行注释
支持多种文件类型：支持超过20种编程语言，包括Vue, React, JavaScript, Python等

注释循环切换

使用单个快捷键，代码会在三种状态之间循环切换：

未注释 → 添加普通注释
普通注释 → 添加嵌套注释
嵌套注释 → 移除所有注释（回到未注释状态）

多行块注释功能

当选择多行代码时，扩展会自动使用块注释而不是单行注释，这样可以：

保持代码的原始缩进和格式
保留选择中的任何现有注释
使注释更加清晰和易于阅读
适应不同编程语言的块注释语法

支持的注释类型

HTML风格注释 ()
JavaScript单行注释 (// )
JavaScript块注释 (/* */)
Python注释 (# 和 """ 块注释)
Ruby注释 (# 和 =begin/=end 块注释)
CSS注释 (/* */)
以及更多语言特定的注释格式

嵌套注释示例

html单行注释示例：

原始代码：

<div>这是一段代码</div>

第一次按快捷键（添加普通注释）：

<!-- <div>这是一段代码</div> -->

第二次按快捷键（添加嵌套注释）：

<!-- /* <div>这是一段代码</div> */ -->

第三次按快捷键（移除所有注释）：

<div>这是一段代码</div>

多行块注释示例：

<div>
    <div>这是一段代码</div>
    <!-- <div>这是一段代码</div> -->
</div>

第一次按快捷键（添加普通注释）：

<!-- <div>这是一段代码</div> -->

第二次按快捷键（添加嵌套注释）：

<!-- <div>
    <div>这是一段代码</div>
    /* <div>这是一段代码</div> */
</div> -->

第三次按快捷键（移除我们刚刚加的注释，并恢复用户以前的注释）：

<div>
    <div>这是一段代码</div>
    <!-- <div>这是一段代码</div> -->
</div>

js单行注释示例： 注释前

const a = 1;

注释后

// const a = 1;

原始代码： js多行注释示例：

function example() {
  const a = 1;
  const b = 2;
  return a + b;
}

选择整个函数并按快捷键（添加块注释）：

/*
function example() {
  const a = 1;
  const b = 2;
  return a + b;
}
*/

再次按快捷键（移除块注释）：

function example() {
  const a = 1;
  const b = 2;
  return a + b;
}

使用方法

选择需要注释/取消注释的代码行或代码块
使用快捷键或命令：

快捷键

切换注释状态：Ctrl+Alt+/ (Windows/Linux) 或 Cmd+Alt+/ (Mac)

命令面板

按下 F1 或 Ctrl+Shift+P (Windows/Linux) / Cmd+Shift+P (Mac) 打开命令面板
输入 "切换嵌套注释"

支持的文件类型

Vue (.vue)
React JSX (.jsx)
React TSX (.tsx)
JavaScript (.js)
TypeScript (.ts)
HTML (.html)
CSS (.css)
SCSS (.scss)
LESS (.less)
Python (.py)
Java (.java)
C/C++ (.c, .cpp)
C# (.cs)
Go (.go)
Rust (.rs)
Ruby (.rb)
JSON (.json)
XML (.xml)
PHP (.php)
Markdown (.md)
以及更多...

优势

操作效率更高：只需记住一个快捷键，即可完成所有注释操作
注释样式更美观：优化了注释符号，减少了不必要的标记
智能识别：自动检测当前注释状态，执行最合适的操作
多行块注释：选择多行代码时自动使用块注释，保持代码格式
广泛的语言支持：支持超过20种编程语言的注释格式

版本历史

0.0.4

修复了JavaScript文件多行注释格式问题
修复了Vue文件script部分注释格式问题
优化了注释逻辑，JavaScript使用简单的两状态切换
添加了扩展图标
改进了Vue文件中不同区域的注释格式识别

0.0.3

添加多行块注释功能
扩展支持的编程语言范围
优化块注释的格式和缩进处理
改进对不同语言注释语法的识别

0.0.2

优化注释样式，使其更简洁美观
将添加注释和移除注释的功能合并为单个切换命令
改进注释识别算法，支持更复杂的嵌套场景
增强多行混合注释的处理能力

0.0.1

初始版本
支持基本的嵌套注释功能
支持Vue、React、JavaScript、TypeScript和HTML文件类型

反馈与贡献

如果你发现任何问题或有改进建议，请在GitHub仓库中提交issue或pull request。

祝您使用愉快！

Nested Comments XT

nested-comments-xt