Adicione comentários invisíveis no seu código sem alterar a lógica ou deixar rastros visuais evidentes no texto. Ideal para anotações privadas, revisões ou lembretes temporários.
🚀 Como Usar
Atenção para não quebrar os comentários:
- Sempre abra o vscode na pasta raiz do projeto, pode ser com o comando: code .
- Não edite o código com outro editor, use sempre o VSCODE
- Caso trabalhe em equipe, faça alterações sempre em branches, sempre atualize com git pull, e inclua a pasta .comments nos commits, também peça para todos usarem essa extensão e seguirem essas regras.
(Se não usar assim, vai quebrar seus comentários!)
1. Adicionar Comentário Invisível
Método 1: Menu de Contexto
- Selecione o trecho de código
- Clique com o botão direito
- Escolha "Adicionar Comentário Invisível"
- Digite seu comentário na caixa que aparece
- Pressione Enter
Método 2: Atalho de Teclado
- Selecione o trecho
- Pressione
Ctrl+Shift+C
(Windows/Linux) ou Cmd+Shift+C
(Mac)
- Digite o comentário
- Pressione Enter
Método 3: Paleta de Comandos
- Selecione o trecho
- Pressione
Ctrl+Shift+P
(Windows/Linux) ou Cmd+Shift+P
(Mac)
- Digite
Invisible Comments: Adicionar Comentário Invisível
- Pressione Enter
- Digite o comentário
2. Visualizar Comentários
Highlight Visual:
- Trechos comentados têm fundo amarelo claro
- Uma borda sutil indica que há um comentário oculto
Tooltip:
- Passe o mouse sobre o trecho destacado
- Um tooltip aparecerá com o comentário
- Um ícone 💬 identifica os comentários invisíveis
3. Remover Comentário
Método 1: Menu de Contexto
- Coloque o cursor sobre o trecho comentado
- Clique com o botão direito
- Selecione "Remover Comentário Invisível"
- Confirme
Método 2: Paleta de Comandos
- Coloque o cursor sobre o trecho comentado
- Pressione
Ctrl+Shift+P
ou Cmd+Shift+P
- Digite
Invisible Comments: Remover Comentário Invisível
- Confirme
4. Visualizar Todos os Comentários
Painel de Comentários:
- Pressione
Ctrl+Shift+P
ou Cmd+Shift+P
- Digite
Invisible Comments: Mostrar Todos os Comentários
- Pressione Enter
- Uma nova aba será aberta com todos os comentários organizados por arquivo
🔧 Funcionalidades Técnicas
Sincronização Automática
A extensão monitora alterações no código:
- Linhas adicionadas/removidas: ajusta automaticamente os comentários
- Texto modificado: atualiza o hash para manter a referência correta
- Salvamento: persiste os comentários automaticamente na pasta do projeto/.comments
Identificação de Trechos
Cada comentário invisível é associado a:
- Hash do texto original
- Posição (linha/coluna inicial e final)
- Arquivo de origem (caminho relativo)
⚙️ Configuração de Cores
Método 1: Interface Gráfica do VSCode
- Pressione
Ctrl+,
ou Cmd+,
- Pesquise por
Invisible Comments
- Configure:
- Highlight Color: fundo do trecho
- Border Color: borda ao redor
- Overview Ruler Color: marcador na barra lateral
Método 2: Diretamente no settings.json
{
"invisibleComments.highlightColor": "rgba(255, 255, 0, 0.1)",
"invisibleComments.borderColor": "rgba(255, 255, 0, 0.3)",
"invisibleComments.overviewRulerColor": "rgba(255, 255, 0, 0.8)"
}
Comandos DEV
Instale dependências
npm install
Instale a CLI do VSCE (caso ainda não tenha)
npm install -g vsce
Compile a extensão
npm run compile
Empacote a extensão
vsce package
Instale localmente no VSCode
code --install-extension invisible-comments-1.0.0.vsix
src/
├── comments/
│ ├── core.ts # Funções principais de manipulação de comentários
│ ├── decorations.ts # Funções de decoração do editor
│ ├── fileHandlers.ts # Funções para lidar com eventos de arquivos
│ ├── persistence.ts # Funções de persistência (salvar/carregar)
│ ├── ui.ts # Funções de interface do usuário
│ └── types.ts # Tipos e interfaces
├── extension.ts # Ponto de entrada da extensão