Como Hospedar Site do Lovable em cPanel: Tutorial Passo a Passo

Neste tutorial, você vai aprender a publicar seu projeto Lovable em qualquer plano de hospedagem com cPanel, usando um método simples e direto — sem precisar configurar GitHub Actions, FTP avançado ou deploy automático complicado. Ideal para quem usou o Lovable para criar um site por conta própria e agora quer colocar no ar com domínio próprio.

Por que hospedar seu site Lovable em domínio próprio

Hospedar o site em domínio próprio resolve esses três pontos. Você paga uma hospedagem brasileira a partir de R$ 26,90/mês, usa seu próprio domínio e tem total controle sobre os arquivos. Se um dia quiser trocar de ferramenta, migrar para WordPress ou ajustar algo direto no código, tudo está nas suas mãos.

O que você vai precisar antes de começar

Antes de seguir o passo a passo, garanta que você tem:

• Conta no Lovable com um projeto pronto e conectado ao GitHub
• Hospedagem com cPanel ativa (qualquer plano funciona, já que o site Lovable é estático)
• Domínio apontado para os servidores da hospedagem (ou use um domínio que você já tem na conta)
• Node.js instalado no seu computador — baixe em nodejs.org
• 10 a 15 minutos de atenção para seguir os passos

Não precisa saber programar, mas precisa saber copiar e colar comandos no terminal do seu computador. Vamos junto.

Passo 1: Conectar o Lovable ao GitHub e baixar o código

Dentro do seu projeto no Lovable, você precisa conectar com uma conta do GitHub. Essa integração permite baixar todo o código do seu site como um arquivo ZIP.

1. Abra seu projeto no Lovable
2. Vá em GitHub no menu superior do projeto
3. Autorize o Lovable a criar um repositório na sua conta GitHub
4. Após conectado, acesse o repositório criado (vai aparecer no seu perfil do GitHub)
5. No repositório, clique no botão verde Code
6. Selecione Download ZIP
7. Salve o arquivo ZIP no seu computador (pode ser na Área de Trabalho ou na pasta Documentos)

Extraia o ZIP. No Mac, clique duas vezes no arquivo — ele descompacta automaticamente em uma pasta com o nome do projeto. No Windows, clique com o botão direito e escolha “Extrair tudo” ou “Extract all”.

Você vai ficar com uma pasta contendo o código do seu projeto Lovable. Essa pasta é onde vamos trabalhar nos próximos passos.

Passo 2: Rodar o build do projeto no seu computador

Agora vamos transformar o código bruto do Lovable em arquivos prontos para hospedagem. Esse processo se chama build — basicamente, o computador compila tudo em HTML, CSS e JavaScript otimizados.

Antes de continuar, confirme que você já instalou o Node.js no seu computador. Se ainda não instalou, baixe em nodejs.org e siga o instalador normalmente. O npm (que vamos usar nos comandos) vem junto com o Node.js.

No MacBook (macOS)

Veja o passo a passo completo no vídeo abaixo:

O processo em texto:

1. Abra o Terminal (está em Aplicativos → Utilitários, ou pesquise no Spotlight com Cmd+Espaço)
2. Digite cd (com espaço depois), arraste a pasta do projeto Lovable para a janela do Terminal e pressione Enter. Isso vai te levar para dentro da pasta do projeto
3. Digite o primeiro comando e pressione Enter:npm i Esse comando instala todas as dependências do projeto. Vai demorar alguns minutos na primeira vez — é normal aparecer muita coisa rolando na tela
4. Quando terminar, digite o segundo comando:npm run build Esse comando gera os arquivos finais do site. Quando terminar, uma pasta nova chamada dist vai aparecer dentro da pasta do projeto

No Windows

Veja o passo a passo completo no vídeo abaixo:

O processo em texto:

1. Abra o Prompt de Comando (pesquise “cmd” no menu Iniciar)
2. Navegue até a pasta do projeto. Se a pasta está em Documentos, digite algo como:cd C:\Users\SeuUsuario\Documents\nome-do-projeto Substitua SeuUsuario pelo nome do seu usuário no Windows e nome-do-projeto pelo nome da pasta extraída
3. Digite o primeiro comando e pressione Enter:npm i
4. Depois que terminar, digite:npm run build
5. Uma pasta nova chamada dist será criada dentro da pasta do projeto

Confirmando que o build deu certo

Depois que rodou npm run build, abra a pasta do projeto no Finder (Mac) ou Explorer (Windows) e confirme que existe uma pasta chamada dist dentro dela. Essa pasta contém o arquivo index.html e uma pasta assets com os CSS e JavaScript do seu site.

Se a pasta dist não apareceu, algo deu errado no build. Geralmente é porque o comando npm i não completou totalmente. Execute os dois comandos de novo, do zero.

Passo 3: Fazer upload dos arquivos no cPanel

Agora vamos subir o conteúdo da pasta dist para sua hospedagem.

1. Acesse o cPanel da sua hospedagem. Na Nuvem Hospedagem, você entra pela área do cliente e clica em “cPanel” no menu de ações rápidas do seu plano
2. Dentro do cPanel, procure e clique em Gerenciador de Arquivos (ou File Manager)
3. Navegue até a pasta public_html — essa é a pasta pública que serve o conteúdo do seu domínio principal
4. Importante: se já existir algum arquivo padrão dentro da public_html (como default.html, index.html de boas-vindas ou similar), apague antes de subir os arquivos novos. Senão pode aparecer a página antiga no lugar do seu site
5. No seu computador, abra a pasta dist do projeto Lovable (não a pasta do projeto inteira — só a dist)
6. Selecione todos os arquivos e subpastas que estão dentro da pasta dist (o index.html, a pasta assets e outros que houver)
7. No Gerenciador de Arquivos do cPanel, clique em Upload (no topo da tela) e arraste todos os arquivos que você selecionou

Atenção: você está subindo o conteúdo de dentro da pasta dist, não a pasta dist inteira. Se subir a pasta inteira, seu site vai ficar acessível em seudominio.com.br/dist/ em vez de seudominio.com.br/, o que não é o que a gente quer.

Depois do upload, volte para o Gerenciador de Arquivos e confirme que dentro da public_html aparece:

• index.html
• pasta assets
• outros arquivos que estavam dentro de dist

Passo 4: Testar o site

Acesse seu domínio pelo navegador:

https://seudominio.com.br

Seu site Lovable deve carregar normalmente. Se aparecer corretamente, está pronto — site online.

Se abrir uma página em branco ou erro, pode ser uma de duas coisas:

• Cache do navegador — pressione Ctrl+F5 (Windows) ou Cmd+Shift+R (Mac) para forçar recarregamento
• Algum arquivo não subiu — volte no cPanel e confira se todos os arquivos da pasta dist estão em public_html

Qual plano de hospedagem usar

Um projeto Lovable após o build é composto apenas por arquivos estáticos — HTML, CSS e JavaScript. Não usa banco de dados, não precisa de PHP, não consome muita memória. Por isso, qualquer plano de hospedagem com cPanel consegue rodar seu projeto Lovable sem problema.

Na Nuvem Hospedagem, o plano de entrada (Básico) a partir de R$ 26,90/mês já é suficiente para a maioria dos projetos Lovable.

O diferencial de hospedar na Nuvem é que os servidores ficam no Brasil (data center Ascenty em Vinhedo/SP), com infraestrutura NVMe e LiteSpeed — o que garante carregamento rápido para visitantes. E se precisar de ajuda com qualquer configuração específica após o upload, o suporte técnico em português via WhatsApp resolve no mesmo dia.

Perguntas frequentes:

Como atualizo meu site depois que subi no cPanel?

Sempre que fizer alterações no Lovable, você precisa repetir o processo: baixar o ZIP do GitHub, rodar npm i e npm run buildde novo (no seu computador) e subir os arquivos novos da pasta dist para public_html, substituindo os arquivos antigos. Algumas pessoas automatizam isso com GitHub Actions, mas a forma manual funciona perfeitamente para sites atualizados com pouca frequência.

Preciso pagar o plano Pro do Lovable para hospedar em domínio próprio?

Não. Mesmo no plano gratuito do Lovable você consegue conectar ao GitHub e baixar o código do seu projeto. O plano pago do Lovable é necessário apenas se você quiser usar a hospedagem nativa da plataforma — o que não é o caso aqui.

Qual a diferença entre este método e o deploy automático via GitHub?

O método deste tutorial é manual: a cada atualização do site, você baixa o ZIP, faz o build e sobe os arquivos. O deploy automático (via GitHub Actions) faz isso automaticamente quando você salva uma alteração no Lovable, mas exige configuração técnica mais avançada — ideal para quem já tem experiência com Git e CI/CD. Para iniciantes, o método manual é mais simples e direto.

Meu site tem rotas internas (tipo /sobre, /contato). Funciona normalmente?

Sites Lovable com múltiplas páginas internas podem precisar de uma configuração adicional no arquivo .htaccess para que as rotas funcionem corretamente quando acessadas direto pelo navegador. Se seu site tem essa estrutura e apresentar algum problema, abra um ticket com o suporte técnico da Nuvem — a equipe faz o ajuste rapidamente.

Preciso saber programar para fazer isso?

Não. Este tutorial foi feito para quem não tem conhecimento técnico. Você só precisa saber copiar e colar comandos no terminal (o npm i e o npm run build) e arrastar arquivos para upload no cPanel. Se seguir os passos com atenção, funciona.

Qual plano da Nuvem Hospedagem devo contratar?

Para projetos Lovable pequenos ou médios, o plano Básico (R$ 26,90/mês) atende perfeitamente. Se você pretende ter múltiplos sites, usar o Elementor Pro em outros projetos WordPress ou precisa de mais recursos, os planos Intermediário, Avançado ou Especial oferecem benefícios adicionais.

Posso usar este mesmo método para outros sites feitos com IA (como v0, Bolt.new)?

Sim, desde que o projeto gere um build estático (HTML, CSS e JavaScript) e a ferramenta permita exportar o código para GitHub ou como ZIP. O processo de build (npm i + npm run build) e upload no cPanel é o mesmo para a maioria dessas ferramentas.

Conclusão

Hospedar um site do Lovable em cPanel é mais simples do que parece. Com Node.js instalado, GitHub conectado e acesso ao cPanel da sua hospedagem, você tem seu site online em menos de 20 minutos, com domínio próprio e sem depender da mensalidade da plataforma.

Se você criou seu site no Lovable e quer colocá-lo no ar com performance real no Brasil, os planos de hospedagem da Nuvem vêm com servidores brasileiros, infraestrutura NVMe, LiteSpeed e suporte técnico em português pronto para ajudar com qualquer ajuste pós-upload.