Pular para o conteúdo
Heartscale

lovablePublicado em · Equipe Heartscale

Como hospedar um app do Lovable numa VPS com Coolify

Para hospedar um app do Lovable numa VPS com Coolify, instale o Coolify num servidor Linux, ligue o repositório do GitHub pelo GitHub App e escolha o build: Nixpacks com saída estática em /dist ou um Dockerfile. Depois, cadastre as variáveis VITE_ como variáveis de build, aponte o domínio com https:// e ative o deploy a cada push.

Recomendação da Heartscale: faça o primeiro deploy num subdomínio de teste e confira login, gravação e recarga de rotas internas antes de apontar o domínio de produção. Se o app tem usuários reais, pagamento ou dados pessoais, peça uma revisão de variáveis e segredos antes de virar o DNS.

Este guia cobre só a hospedagem. Se você ainda precisa tirar o código e o banco do Lovable, comece por Como sair do Lovable e volte aqui no passo do servidor.

O que você precisa antes de começar

  • Uma VPS Linux. O Coolify pede 2 núcleos de CPU, 2 GB de RAM e 10 GB de disco, com acesso root ou sudo por SSH (Coolify, Installation). A doc recomenda um servidor novo.
  • Um domínio em que você consiga editar o DNS.
  • O código no GitHub. No Lovable, o caminho é o Git sync em Project settings → Git (Lovable, GitHub).
  • Saber a stack do projeto. Abra o package.json. Se tiver @tanstack/react-start, é TanStack Start e precisa de um servidor Node. Se não tiver, é React + Vite e o build gera arquivos estáticos em dist/ (Lovable, Deploying outside Lovable).

Passo 1: instale o Coolify

Entre na VPS por SSH e rode o instalador oficial:

curl -fsSL https://cdn.coollabs.io/coolify/install.sh | bash

Se o Docker foi instalado pelo snap, remova antes. No Ubuntu, use uma versão LTS: 20.04, 22.04 ou 24.04.

Ao terminar, o terminal mostra o link do painel, em http://<ip-do-servidor>:8000. Crie a conta de administrador na hora. A doc avisa que quem chegar primeiro à tela de cadastro vira administrador e ganha acesso root ao servidor.

Libere no firewall as portas que o Coolify usa (Coolify, Firewall):

Porta Para quê
22 SSH
80 HTTP e emissão do certificado
443 HTTPS
8000 Painel pelo IP
6001 e 6002 Atualização em tempo real e terminal do painel pelo IP

Quando o painel passar a abrir por um domínio, você pode fechar 8000, 6001 e 6002.

Guarde uma cópia do arquivo /data/coolify/source/.env. Ele tem a APP_KEY, que cifra os dados do Coolify e é necessária para restaurar a instalação.

Passo 2: ligue o GitHub pelo GitHub App

O repositório criado pelo Lovable é privado por padrão. O caminho indicado para repositório privado com deploy a cada push é o GitHub App (Coolify, GitHub App):

  1. No painel, abra Sources e escolha GitHub App.
  2. Dê um nome à fonte. Deixe Organization vazio se o repositório é da sua conta pessoal.
  3. Clique em Register with GitHub, dê um nome único ao app no GitHub e confirme em Create GitHub App.
  4. Em Install repositories, escolha Only select repositories e marque só o repositório do app.

Dar acesso só ao repositório do app limita o que o Coolify enxerga na sua conta.

Passo 3: crie a aplicação

  1. Abra o projeto e o ambiente no Coolify e clique em + New.
  2. Escolha Private Repository (with GitHub App).
  3. Selecione o servidor. Numa instalação própria, ele aparece como localhost.
  4. Escolha a fonte do passo 2, o repositório e clique em Load Repository.
  5. Escolha o branch que o Lovable sincroniza, em geral o main.

O próximo campo é o Build pack. Ele decide como o código vira site.

Passo 4: escolha o build

React + Vite com Nixpacks

É o caminho com menos arquivos novos. O Nixpacks detecta o projeto Node e gera a imagem sozinho (Coolify, Nixpacks):

  1. Em Build pack, escolha Nixpacks. Deixe Base Directory em /.
  2. Em Output type, escolha Static site e preencha Publish Directory com /dist.
  3. Mantenha a porta 80. É nela que o Nginx gerado escuta.
  4. Depois de criar, em General → Build pipeline → Site type, escolha SPA.
  5. Confira em General os campos Install Command, Build Command e Start Command. Mude só o que vier errado.

O Lovable builda com Node 22. O Nixpacks lê a versão do engines.node do package.json, do .nvmrc ou da variável NIXPACKS_NODE_VERSION.

React + Vite com Dockerfile

Use este caminho se quiser controlar a imagem. O Lovable sugere duas etapas: node:22-alpine para buildar e nginx:alpine para servir o dist/ (Lovable, Deploying outside Lovable). Um exemplo nesse formato:

FROM node:22-alpine AS build
WORKDIR /app
COPY package*.json ./
RUN npm ci
COPY . .
ARG VITE_SUPABASE_URL
ARG VITE_SUPABASE_PUBLISHABLE_KEY
ARG VITE_SUPABASE_PROJECT_ID
RUN npm run build

FROM nginx:alpine
COPY --from=build /app/dist /usr/share/nginx/html
COPY nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80

E o nginx.conf ao lado, com o fallback de SPA:

server {
  listen 80;
  root /usr/share/nginx/html;
  location / {
    try_files $uri $uri/ /index.html;
  }
}

No Coolify, escolha Dockerfile em Build pack e preencha Ports Exposes com 80 (Coolify, Dockerfile). O Coolify passa as variáveis de build como argumentos do Docker, por isso o Dockerfile declara os ARG. O Lovable avisa que não roda nem testa builds Docker: teste você mesmo.

TanStack Start

Projetos criados no Lovable a partir de 13/05/2026 usam TanStack Start e precisam de um servidor Node rodando. O build usa NITRO_PRESET=node-server npm run build e o servidor sobe com node .output/server/index.mjs, na porta 3000. No Coolify, deixe a porta interna em 3000. O processo precisa escutar em 0.0.0.0, senão o proxy não o alcança: defina HOST=0.0.0.0. Aqui não há fallback de SPA, porque quem cuida das rotas é o servidor.

Passo 5: configure as variáveis VITE_

As variáveis com prefixo VITE_ entram no código na hora do build. Em projeto do Lovable, são VITE_SUPABASE_URL, VITE_SUPABASE_PUBLISHABLE_KEY e VITE_SUPABASE_PROJECT_ID, com os valores do .env do projeto.

No Coolify (Coolify, Environment variables):

  1. Abra a aplicação e clique em Environment Variables.
  2. Clique em Add, preencha Name e Value e salve em Add variable. Se preferir, cole o .env inteiro no modo Developer.
  3. Para as VITE_, deixe Build time em Available during build.

Mudou o valor de uma VITE_? Faça um deploy novo. Restart só serve para variáveis de runtime.

Tudo o que tem VITE_ vai parar no navegador de qualquer visitante. Segredo de pagamento, de e-mail ou de IA nunca leva esse prefixo. No TanStack Start, segredos de funções de servidor ficam como variável de runtime, com Build time em Not available during build.

Na nossa revisão, antes do primeiro deploy, listamos cada variável e conferimos se alguma com prefixo VITE_ guarda um segredo. Depois do build, procuramos esses valores nos arquivos de dist/ para confirmar o que vai para o navegador.

Passo 6: aponte o domínio e ative o HTTPS

  1. No DNS do domínio, aponte o endereço para o IP da VPS. Se for usar www e o domínio sem www, crie os dois registros.
  2. No Coolify, abra Domains e clique em Add domain.
  3. Em Protocol, escolha https. Em Domain, digite o endereço, por exemplo app.seudominio.com.br.
  4. Cadastre cada endereço separadamente. Para ter só um como principal, use a opção www redirect (Redirect to www ou Redirect to non-www).
  5. Faça um deploy novo para o proxy aplicar a configuração.

Com https:// e as portas 80 e 443 abertas, o proxy do Coolify pede e renova o certificado (Coolify, Domains).

Volte ao login do app e cadastre a URL nova na lista de URLs de retorno. Sem isso, o login quebra no domínio novo.

Passo 7: deploy a cada push

Aplicações criadas pelo GitHub App já vêm com Auto deploy em Deploy on push (webhooks) (Coolify, Auto deploy). Se aparecer Manual deployments only, mude em Advanced → Deployment. Depois, faça um push no branch e veja se o deploy aparece.

O Git sync do Lovable grava no branch conectado. Então cada alteração feita no chat do Lovable também vai para o ar. Se você quer revisar antes, faça o deploy manual ou aponte o Coolify para outro branch e junte as mudanças por pull request.

Passo 8: teste o fallback de SPA

Abra uma rota interna direto pelo endereço, por exemplo /painel, e recarregue. Se der 404, falta o fallback para o index.html.

No Nixpacks, vá em General → Build pipeline → Custom Nginx configuration, acrescente o try_files $uri $uri/ /index.html; no bloco location / e faça um deploy novo. Um restart não aplica a mudança, porque a configuração entra na imagem durante o build.

Faça também os outros testes da doc do Lovable: entrar e sair do app, ler, gravar e enviar um arquivo.

O que passa a ser seu

Fora do Lovable, você cuida de certificados, backups, controle de acesso, monitoramento e auditorias de segurança (Lovable, Deployment, hosting and ownership). Três pontos do Coolify:

  • Backup da instalação. Guarde o /data/coolify/source/.env fora do servidor. A doc pede um backup antes de cada atualização.
  • Atualizações. Em Settings → Updates, Automatic updates atualiza o Coolify. A atualização não mexe nos apps, nos bancos nem nos servidores que ele gerencia (Coolify, Upgrade).
  • O endereço antigo. O lovable.app continua servindo a última versão publicada lá, e o botão Publish publica só no Lovable.

Para pôr na balança o que isso custa por mês, veja Quanto custa manter um app do Lovable no ar e a página de deploy em servidor próprio.

Fazer sozinho ou contratar?

Para quem já usa SSH e DNS, a instalação é a parte simples. O que pesa é o que você assume depois.

Situação Caminho
Projeto React + Vite sem segredos no front, e alguém do time usa SSH e DNS Faça sozinho com este guia
Usuários reais com login por Google ou outro provedor Vale chamar uma equipe: domínio, HTTPS e URLs de retorno precisam virar juntos
Segredos de pagamento, e-mail ou IA, ou TanStack Start com funções de servidor Vale chamar uma equipe, como a nossa: um erro na separação entre variáveis de build e de runtime põe a chave no navegador
Ninguém técnico para manter servidor, backups e atualizações Peça o diagnóstico da Heartscale antes de alugar a VPS: ele mostra o que o app usa do Lovable e o que precisa de ajuste para rodar fora

Peça o diagnóstico da Heartscale

Nossa equipe confere a stack do seu app, monta o build no Coolify, separa as variáveis de build dos segredos e deixa HTTPS, domínio e deploy a cada push funcionando. Antes, o diagnóstico mostra o que o seu app usa do Lovable e o que precisa de ajuste para rodar fora.

O diagnóstico de lançamento custa R$ 99 (de R$ 398) e é abatido se você fechar o deploy. Só trabalhamos em app de quem prova ser dono.

Pedir o diagnóstico

Perguntas frequentes

Perguntas frequentes

Qual VPS eu preciso para rodar o Coolify com um app do Lovable?

A documentação do Coolify pede pelo menos 2 núcleos de CPU, 2 GB de RAM e 10 GB de disco, num Linux com acesso root por SSH. Para Ubuntu, use uma versão LTS (20.04, 22.04 ou 24.04) e um servidor novo.

O Coolify consegue buildar um projeto React + Vite exportado do Lovable?

Sim. Com o build pack Nixpacks, o Coolify roda o npm run build e serve a pasta /dist pelo Nginx quando você escolhe Static site e Publish Directory /dist. Também dá para usar o Dockerfile em duas etapas que o Lovable sugere.

Por que minhas variáveis VITE_ não aparecem no app hospedado no Coolify?

Variáveis VITE_ entram no código na hora do build, não quando o app roda. No Coolify, deixe Build time em Available during build e faça um deploy novo depois de mudar o valor. Um Restart não basta.

Como o Coolify faz o HTTPS do meu domínio?

Aponte o DNS do domínio para o IP da VPS, abra as portas 80 e 443 e cadastre o endereço com https:// em Domains. O proxy do Coolify pede e renova o certificado sozinho depois do redeploy.

Toda alteração que eu fizer no Lovable vai para o ar no Coolify?

Se o Git sync do Lovable grava no mesmo branch que o Coolify acompanha e o Auto deploy está em Deploy on push (webhooks), sim. Cada push no branch configurado gera um deploy novo.

Meu app do Lovable dá 404 ao recarregar uma página no Coolify. O que fazer?

Falta o fallback de SPA: o servidor precisa devolver o index.html para rotas que não são arquivos. No Coolify, ajuste em General → Build pipeline → Custom Nginx configuration com try_files e faça um deploy novo.

Vale a pena contratar alguém para hospedar um app do Lovable com Coolify?

Vale quando o app tem usuários reais, pagamento ou dados pessoais, ou quando ninguém do time vai cuidar de servidor, backups e atualizações. A Heartscale faz um diagnóstico de lançamento por R$ 99 (de R$ 398), abatido se você contratar o deploy em até 15 dias.

Comece pelo diagnóstico.

O diagnóstico custa R$ 99, pagos por Pix. Entregamos o relatório em 2 dias úteis e apresentamos os resultados em reunião. O valor é abatido se você contratar o serviço em até 15 dias. Tudo o que configuramos fica no seu nome.

Reduz o risco, não o zera. Atendemos somente o dono do app, mediante comprovação.