Claude TypeScript MCP Servers

Uma coleção de servidores MCP TypeScript para aprimorar o Claude Desktop como um assistente de desenvolvimento poderoso usando sua assinatura Claude Pro/Max.

GitHub
19
Experimente este MCPPatrocinado

Documentação

Claude TypeScript MCP Servers (Para Desenvolvedores de Software)

Uma coleção abrangente de servidores Model Context Protocol (MCP) que transformam o Claude Desktop em um poderoso assistente de desenvolvimento. Este projeto aproveita sua assinatura de taxa fixa do Claude Pro/Max para fornecer capacidades semelhantes ao Cline, mas sem os custos de API por token.

Artigo de explicação em japonês: Cline任せでコード書いてたらAPIクレジットが爆散したのでClaude Desktop + MCPをいい感じにしてサブスクだけで無双する

🚀 Recursos

  • Operações de Sistema de Arquivos - Ler, escrever e gerenciar arquivos com restrições de segurança
  • Integração com Git - Suporte completo ao fluxo de trabalho Git, incluindo commits, branches e diffs
  • API do GitHub - Gerenciar repositórios, issues, PRs e mais com suporte a múltiplas contas
  • Pesquisa na Web - Pesquisa com IA usando Sonar e pesquisa tradicional por palavras-chave com Brave
  • Automação de Navegador - Mais de 30 ferramentas Puppeteer para scraping e automação web
  • Comandos de Shell - Executar comandos de desenvolvimento em um ambiente controlado
  • Busca de URLs - Extrair conteúdo de páginas web com conversão de HTML para Markdown

📋 Requisitos

  • Node.js v18 ou superior
  • Runtime Bun
  • Aplicativo Claude Desktop
  • Chaves de API para serviços externos (Brave Search, Perplexity/Sonar)

🛠️ Instalação

# Clone the repository
git clone https://github.com/yourusername/claude-ts-mcps.git
cd claude-ts-mcps

# Install dependencies
bun install

⚙️ Configuração

Crie um arquivo de configuração para o Claude Desktop com todos os servidores MCP:

{
  "mcpServers": {
    "filesystem": {
      "command": "/Users/username/.bun/bin/bun",
      "args": [
        "run",
        "/path/to/claude-ts-mcps/src/filesystem.ts",
        "/Users/username"
      ]
    },
    "git": {
      "command": "/Users/username/.bun/bin/bun",
      "args": ["run", "/path/to/claude-ts-mcps/src/git.ts"]
    },
    "github": {
      "command": "/Users/username/.bun/bin/bun",
      "args": ["run", "/path/to/claude-ts-mcps/src/github.ts"],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "YOUR_DEFAULT_TOKEN",
        "GITHUB_TOKEN_WORK": "YOUR_WORK_ACCOUNT_TOKEN",
        "GITHUB_TOKEN_PERSONAL": "YOUR_PERSONAL_ACCOUNT_TOKEN"
      }
    },
    "brave-search": {
      "command": "/Users/username/.bun/bin/bun",
      "args": ["run", "/path/to/claude-ts-mcps/src/brave-search.ts"],
      "env": {
        "BRAVE_API_KEY": "YOUR_BRAVE_API_KEY"
      }
    },
    "sonar": {
      "command": "/Users/username/.bun/bin/bun",
      "args": ["run", "/path/to/claude-ts-mcps/src/sonar.ts"],
      "env": {
        "PERPLEXITY_API_KEY": "YOUR_PERPLEXITY_API_KEY"
      }
    },
    "puppeteer": {
      "command": "/Users/username/.bun/bin/bun",
      "args": ["run", "/path/to/claude-ts-mcps/src/puppeteer/index.ts"]
    },
    "shell": {
      "command": "/Users/username/.bun/bin/bun",
      "args": ["run", "/path/to/claude-ts-mcps/src/shell.ts"]
    },
    "fetch": {
      "command": "/Users/username/.bun/bin/bun",
      "args": ["run", "/path/to/claude-ts-mcps/src/fetch.ts"],
      "env": {
        "CUSTOM_USER_AGENT": "YOUR_CUSTOM_USER_AGENT",
        "IGNORE_ROBOTS_TXT": "false"
      }
    }
  }
}

🔧 Ferramentas Disponíveis

Operações de Sistema de Arquivos (filesystem)

  • Segurança: Restrito a diretórios especificados com proteção contra symlinks
  • Operações Principais:
    • Ler/escrever arquivos com suporte a codificações (utf-8, base64, hex)
    • Leitura parcial de arquivos por intervalo de bytes ou linhas
    • Mover, copiar, excluir, anexar arquivos
    • Criar diretórios e gerenciar árvores de arquivos
  • Edição Avançada:
    • Substituição de texto com pré-visualização de diff
    • Operações baseadas em linhas (substituir, inserir, excluir linhas específicas)
    • Substituições com expressões regulares e grupos de captura
  • Capacidades de Busca:
    • Buscar arquivos por padrões de nome
    • Buscar conteúdo dentro de arquivos (texto simples ou regex)
    • Suporte a padrões de exclusão
  • Operações em Lote:
    • Executar múltiplas operações de arquivo com eficiência
    • Execução paralela para operações de leitura
    • Modo transacional com suporte a rollback
  • Gerenciamento de Arquivos:
    • Comprimir arquivos (zip, tar, tar.gz)
    • Extrair arquivos com controle de sobrescrita
  • Monitoramento de Arquivos:
    • Verificar alterações em arquivos desde um horário específico
    • Suporte a eventos de alteração, renomeação e exclusão
  • Casos de Uso: Edição de código, gerenciamento de projetos, análise de arquivos, operações em lote

Integração com Git (git)

  • Fluxo de Trabalho Git Completo: init, add, commit, branch, checkout, diff, log
  • Gerenciamento de Repositórios: acompanhamento de status, visualização de histórico
  • Gerenciamento de Tags:
    • Criar tags leves e anotadas
    • Listar tags com filtro por padrões
    • Exibir detalhes e mensagens de tags
    • Excluir tags indesejadas
  • Casos de Uso: Controle de versão, revisão de código, histórico de projetos, gerenciamento de releases

API do GitHub (github)

  • Gerenciamento de Repositórios: Criar, buscar, gerenciar repositórios
  • Issues e PRs: Criar, atualizar, mesclar pull requests e issues
  • Gerenciamento de Releases: Criar, atualizar e gerenciar releases
  • Suporte a Múltiplas Contas: Alternar entre contas de trabalho/pessoais
  • Operações de Arquivos: Criação e atualização direta de arquivos via API

Ferramentas de Pesquisa na Web

Pesquisa com IA (sonar)

  • Compreensão de Linguagem Natural: Faça perguntas complexas em linguagem simples
  • Respostas Sintetizadas: Obtenha respostas abrangentes com citações
  • Múltiplos Modelos:
    • sonar: Pesquisa rápida de propósito geral
    • sonar-pro: Consultas complexas com contexto de 200k
    • sonar-reasoning: Raciocínio em cadeia de pensamento
    • sonar-deep-research: Modo de pesquisa abrangente
  • Casos de Uso: Pesquisa, verificação de fatos, aprendizado sobre tópicos complexos

Pesquisa Tradicional (brave-search)

  • Pesquisa na Web: Busca baseada em palavras-chave que retorna múltiplos resultados
  • Pesquisa Local: Encontre empresas e serviços
  • Casos de Uso: Consultas rápidas, encontrar múltiplas fontes, informações locais

Automação de Navegador (puppeteer)

Nossa ferramenta mais abrangente, com mais de 30 funções organizadas em categorias:

🧭 Navegação e Interação Básica

  • Navegar para URLs, tirar screenshots
  • Clicar em elementos, preencher formulários, selecionar opções
  • Passar o mouse sobre elementos, executar JavaScript

⏳ Operações de Espera

  • Aguardar elementos, timeouts, navegação
  • Aguardar condições JavaScript personalizadas

⌨️ Operações de Teclado

  • Pressionar teclas e combinações de teclas
  • Digitar texto com atrasos semelhantes aos humanos

📄 Gerenciamento de Páginas

  • Definir tamanho da viewport, voltar/avançar, recarregar
  • Gerar PDFs, emular dispositivos

🍪 Cookies e Autenticação

  • Definir/obter cookies, autenticação HTTP

ℹ️ Recuperação de Informações

  • Obter título da página, URL, conteúdo HTML
  • Extrair texto e informações detalhadas de elementos

🖼️ Operações de Frames (Avançado)

  • Listar todos os frames, alternar entre frames
  • Executar JavaScript em frames específicos
  • Buscar elementos em todos os frames

🔧 Diversos

  • Adicionar tags de script, limpar campos de entrada

Comandos de Shell (shell)

  • Execução Controlada: Restrições de comandos baseadas em lista de permissões
  • Ferramentas de Desenvolvimento: npm, yarn, bun, git, node, python, tsc
  • Segurança: Previne operações perigosas, restrições de diretório
  • Recursos: Análise automática de strings de comando, limites de tamanho de saída, controle de timeout
  • Modo de Streaming: Agora habilitado por padrão! Captura a saída de processos de longa duração
    • Retorna automaticamente saída parcial após timeout (padrão: 10s) ou limite de buffer (100KB)
    • Comandos normais são concluídos normalmente; afeta apenas processos de longa duração
    • Processos são encerrados automaticamente após o timeout de streaming (padrão seguro)
    • Mantenha processos em execução com killOnStreamingTimeout: false
    • Perfeito para: servidores de desenvolvimento, watchers de build, comandos interativos
    • Desative com streaming: false se necessário
  • Casos de Uso: Gerenciamento de pacotes, processos de build, execução de scripts, monitoramento de servidores

Busca de Conteúdo de URLs (fetch)

  • Extração de Conteúdo: Converter HTML em Markdown limpo
  • Personalização: User agents personalizados, tratamento de robots.txt
  • Casos de Uso: Leitura de documentação, análise de conteúdo

💡 Exemplos de Uso

Fluxo de Trabalho de Desenvolvimento

You: "Create a new React component for user authentication"
Claude: *Uses filesystem to create component file, npm to install dependencies*

You: "Find examples of OAuth implementation on GitHub"
Claude: *Uses GitHub search and fetch to find and analyze implementations*

You: "Test the login form on our staging site"
Claude: *Uses Puppeteer to navigate, fill forms, and verify functionality*

Pesquisa e Análise

You: "What are the latest best practices for Next.js 14 App Router?"
Claude: *Uses Sonar for comprehensive research with citations*

You: "Compare our package.json with similar projects"
Claude: *Uses GitHub to find similar projects, filesystem to read local files*

Automação

You: "Extract all product prices from this e-commerce site"
Claude: *Uses Puppeteer to navigate pages, extract data, and compile results*

You: "Monitor our GitHub issues and create a summary"
Claude: *Uses GitHub API to fetch issues, analyze patterns, generate report*

🔒 Considerações de Segurança

  • Sistema de Arquivos: Restrito apenas aos diretórios especificados
  • Shell: Comandos devem estar na lista de permissões
  • Credenciais: Armazene chaves de API com segurança, use variáveis de ambiente
  • GitHub: Use permissões mínimas de token
  • Fetch: Respeita robots.txt por padrão

🏗️ Estrutura do Projeto

claude-ts-mcps/
├── src/
│   ├── filesystem.ts      # File operations
│   ├── git.ts             # Git integration
│   ├── github.ts          # GitHub API (main entry)
│   ├── github/            # GitHub implementation
│   ├── brave-search.ts    # Brave search API
│   ├── sonar.ts           # Perplexity Sonar API
│   ├── sonar/             # Sonar types and utilities
│   ├── puppeteer/         # Browser automation
│   │   ├── index.ts       # Main entry point
│   │   ├── tools/         # Tool definitions
│   │   ├── handlers/      # Implementation
│   │   └── state.ts       # State management
│   ├── shell.ts           # Shell commands (entry)
│   ├── shell/             # Shell implementation
│   │   ├── index.ts       # Main logic
│   │   ├── executor.ts    # Command execution
│   │   ├── types.ts       # Type definitions
│   │   └── ...            # Other modules
│   └── fetch.ts           # URL fetching
└── package.json

🚧 Desenvolvimento

Para adicionar novas funcionalidades:

  1. Crie um novo arquivo TypeScript em src/
  2. Implemente o servidor MCP usando @modelcontextprotocol/sdk
  3. Adicione definições de ferramentas com descrições claras
  4. Inclua tratamento de erros e validação adequados
  5. Atualize o arquivo de configuração

Testando Suas Alterações

# Run a specific MCP server directly
bun run src/your-new-server.ts

# Test with Claude Desktop
# Update your config and restart Claude

Verificação de Tipos

Este projeto usa TypeScript para segurança de tipos. Vários comandos de verificação de tipos estão disponíveis:

# Standard type check (all strict checks enabled)
bun run type-check

# Type check with file watching for development
bun run type-check:watch

# Type check without unused variable warnings (good for development)
bun run check:loose

# Strict type check (same as type-check)
bun run check:strict

Problemas de Tipos Atuais

O projeto é funcional, mas possui alguns problemas de tipos que estão sendo resolvidos:

  • Algumas APIs do Puppeteer precisam de imports de tipos adequados
  • Alguns casos de valores potencialmente indefinidos precisam de proteções
  • Variáveis não utilizadas em alguns arquivos (podem ser ignoradas durante o desenvolvimento)

Isso não afeta a funcionalidade em tempo de execução, mas será limpo ao longo do tempo.

Formatação de Código

Este projeto usa Prettier para formatação consistente de código. Os seguintes comandos estão disponíveis:

# Format all files
bun run format

# Check formatting without making changes
bun run format:check

# Format only source files (src directory)
bun run format:src

# Check formatting of source files only
bun run format:check:src

# Run both formatting check and type check
bun run lint

# Fix formatting and run type check
bun run lint:fix

Configuração do Prettier

O projeto usa as seguintes configurações do Prettier (.prettierrc):

  • Largura de Impressão: 100 caracteres (80 para JSON/Markdown)
  • Largura da Tabulação: 2 espaços
  • Ponto e Vírgula: Sempre
  • Aspas: Aspas duplas
  • Vírgulas Finais: Todas (ES5+)
  • Parênteses em Arrow: Sempre incluir parênteses

Formatação ao Salvar

Para a melhor experiência de desenvolvimento, configure seu editor para formatar ao salvar:

VS Code: Adicione a .vscode/settings.json:

{
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode"
}

Outros Editores: Consulte a documentação do seu editor para integração com Prettier.

📚 Recursos

📄 Licença

Licença MIT