Uma aplicação criada no Lovable pode ser publicada de maneiras diferentes. Para a maioria dos usuários, as duas opções mais simples são publicar pelo próprio Lovable ou hospedar o frontend gerado em uma conta cPanel.
Antes de escolher, é importante separar duas partes do projeto:
- Frontend: páginas, menus, formulários e demais elementos executados no navegador.
- Backend: banco de dados, autenticação, armazenamento de arquivos, funções, integrações e segredos.
Publicar o frontend em outro servidor não transfere automaticamente o backend nem os dados existentes.
Opção 1: publicar pelo próprio Lovable
É a alternativa mais simples para colocar a aplicação no ar. O Lovable realiza a compilação, a hospedagem e a configuração HTTPS.
- Abra o projeto no Lovable.
- Clique em Publish / Publicar.
- Revise o endereço sugerido e as opções de acesso.
- Confirme a publicação.
- Após novas alterações, utilize Publish changes / Publicar alterações.
O projeto recebe um endereço semelhante a nome-do-projeto.lovable.app. Conforme os recursos disponíveis na conta Lovable, também é possível conectar um domínio ou subdomínio próprio.
Nessa opção, a aplicação permanece hospedada na infraestrutura do Lovable. O DNS do domínio pode estar administrado na Invirtua, mas os registros deverão apontar para o destino informado pelo Lovable.
Opção 2: hospedar o frontend no cPanel
Essa opção coloca os arquivos públicos da aplicação na hospedagem cPanel. O procedimento geral é:
- Sincronizar o projeto com o GitHub ou baixar o código-fonte.
- Gerar a versão de produção com
npm run build. - Localizar a pasta
distcriada pelo processo. - Enviar o conteúdo da pasta
distpara a raiz do domínio no cPanel. - Configurar o redirecionamento de rotas para
index.html.
Os projetos Lovable são normalmente aplicações Vite compiladas como frontend estático. O servidor não precisa executar Node.js para servir o conteúdo da pasta dist; o Node.js é utilizado durante a geração dessa pasta.
Alternativa: GitHub com plataforma de publicação automática
Também é possível conectar o repositório GitHub a uma plataforma de deploy baseada em Git, como Cloudflare Pages, Netlify ou Vercel. Essas plataformas normalmente detectam o projeto e utilizam:
- comando de build:
npm run build; - diretório de saída:
dist; - Node.js 22, salvo exigência diferente do projeto.
Essa alternativa automatiza novas publicações após alterações no repositório, mas a hospedagem ficará no provedor escolhido, e não no cPanel.
Qual opção escolher?
| Cenário | Opção indicada |
|---|---|
| Desejo publicar com o menor número de etapas | Publicação pelo Lovable |
| Desejo usar a hospedagem cPanel para os arquivos do site | Build da aplicação e envio da pasta dist |
| Desejo publicação automática a partir do GitHub | Plataforma de deploy baseada em Git |
| A aplicação possui banco, login ou upload de arquivos | Revisar também onde o backend permanecerá hospedado |
Antes de publicar
- Teste as funções principais no modo de visualização do Lovable.
- Conecte o projeto ao GitHub ou mantenha uma cópia do código.
- Confirme se existem banco de dados, autenticação, Storage ou Edge Functions.
- Revise chaves, segredos e variáveis de ambiente.
- Defina o domínio que será utilizado em produção.
Não envie a pasta do código-fonte diretamente para public_html. Arquivos como src, package.json e componentes React precisam ser compilados. Para uma publicação estática, o conteúdo correto é o resultado existente em dist.
