Instalação no Lovable

O Lovable é um construtor de aplicações com IA que aceita servidores MCP customizados em seus Chat Connectors. Isso permite, em um único prompt, gerar interfaces inteiras que consomem dados reais da WebApiAlcance.

Pré-requisito

Conta no Lovable com acesso ao recurso Chat Connectors (planos pagos) e um MCP_BEARER_TOKEN válido.

Pré-requisitos

Conta no Lovable com acesso ao recurso Chat Connectors (planos pagos).
MCP_BEARER_TOKEN válido.
URL pública do MCP: https://mcp-alcancecontabilidade.vercel.app/api/mcp.

Passo a passo

1. Abrir Chat Connectors

Entre no Lovable e abra qualquer projeto (ou crie um novo).
No painel lateral, clique em Chat (ou no ícone de balão).
No topo do painel de chat, clique em Connectors → Add Custom MCP.

2. Preencher os dados

Campo	Valor
Name	`Alcance`
URL	`https://mcp-alcancecontabilidade.vercel.app/api/mcp`
Auth type	`Bearer`
Token	`<COLE SEU MCP_BEARER_TOKEN>`

Clique em Add Connector. Em poucos segundos a lista de tools (buscar_cliente, listar_certidoes, …) aparece sob o conector.

3. Usar em prompts de geração

Lovable é poderoso porque o MCP entra no contexto da geração de UI. Exemplo de prompt completo:

Crie um dashboard React + Tailwind com:
 
1. Uma sidebar com 3 abas: "Clientes", "Certidões", "Lembretes".
2. Na aba "Clientes": uma busca livre que use o tool `buscar_cliente`
   do conector Alcance. Renderize os resultados como cards com
   razão social, CNPJ formatado e cidade.
3. Na aba "Certidões": uma tabela com filtro por status, alimentada
   pelo tool `listar_certidoes`. Destaque linhas vencidas em vermelho.
4. Na aba "Lembretes": uma lista cronológica com os próximos
   30 dias (use `listar_lembretes` com filtro de período).
5. Tema escuro, responsivo, navegação por hash.
 
Use Server Actions do Next.js para chamar o MCP, nunca exponha
o token no client.

O Lovable irá:

Inspecionar os schemas das tools.
Gerar componentes que chamam o MCP via Server Actions (com o token guardado em variável de ambiente do projeto Lovable).
Renderizar a aplicação de preview imediatamente.

4. Boas práticas

Segurança

Nunca cole o MCP_BEARER_TOKEN no client-side. Lovable guarda o conector de forma segura — referencie-o, não embuta o valor.

Limite a quantidade de tools chamadas por turno. Geração com mais de 4–5 chamadas por prompt tende a falhar; quebre em prompts menores.
Combine com o resource glossario://contabil para que o LLM entenda termos da casa (CND, FGTS, DARF, etc.) ao gerar copy.

Troubleshooting

Sintoma	Solução
"Failed to fetch tools"	URL incorreta ou bloqueio de rede. Teste a URL no navegador (deve retornar resposta MCP, não HTML).
Conector "Unauthorized"	Token errado. Edite o conector e cole novamente o valor.
Tool retorna `cliente_nao_encontrado` mesmo com CNPJ certo	Veja a seção de clientes no troubleshooting.

Mais detalhes em Troubleshooting.