Como instalar Nuxt na Saplo (Vue com renderização SSR)

Nuxt é um framework construído em Vue, com renderização completa do lado do servidor - de forma análoga ao que Next.js é para React. No entanto, o SSR requer um processo Node de longa duração, mantido na memória, e não apenas um diretório com ficheiros estáticos, o que significa que o alojamento partilhado comum não consegue lidar com isso. Na Saplo, executas o Nuxt como um serviço gerido com reinício automático, e o nginx encaminha o tráfego do domínio para ele.

Para quem é o Nuxt na Saplo

Antes de começares a instalação, verifica se é uma boa escolha para o teu projeto:

• site empresarial criado em Vue, que deve ter um bom desempenho nos resultados de pesquisa - o renderização no lado do servidor oferece uma vantagem que um SPA clássico, composto apenas por uma build estática, não oferece,
• loja headless ligada à tua própria API - o Nuxt renderiza as páginas de produtos no lado do servidor, o que ajuda na indexação,
• aplicação fullstack - o Nuxt tem server routes integradas (/server/api), pelo que podes escrever um backend simples no mesmo projeto,
• queres implementações com git push em vez de configuração manual do processo Node - ligas o repositório uma vez, e o Saplo cria e reinicia o serviço automaticamente.

Se o site não precisa de SSR (nuxt generate totalmente estático), uma stack estática do mesmo diretório será mais leve e mais barata de manter.

Requisitos

Para instalares o Nuxt na Saplo, precisas de:

• Uma Box no plano L ou superior - o SSR mantém o processo Node constantemente na memória e renderiza cada pedido novamente, por isso precisa de mais RAM do que uma página estática normal.
• Mínimo de 512 MB de RAM livre e 3 GB de espaço em disco para o processo da aplicação.
• Um domínio ou subdomínio *.saploapp.pl incluído em cada plano.
• Um repositório Git, se quiseres usar a implementação automática (opcional para começar, também podes carregar a aplicação através de um arquivo .zip no Painel).

Instalação passo a passo

1. No Painel Saplo, acede ao Catálogo de aplicações e seleciona Nuxt (categoria "Aplicações").
2. Indica a Box no plano L ou superior e o nome da aplicação - a partir daqui, será criada a subdomínio predefinido.
3. Escolhe a versão do Node.js para o build (18, 20 ou 22, predefinido 22) e confirma a instalação.
4. O motor cria um esqueleto Nuxt 4 mínimo (no Nuxt 4, o código da aplicação mudou para o diretório app/), cria o projeto e executa o processo de longa duração .output/server/index.mjs através do supervisor na porta 3000, e o nginx encaminha o tráfego do domínio para essa porta.
5. Após a conclusão da instalação, o domínio do passo 2 mostra a página inicial do Nuxt a funcionar - a partir deste momento, implementas o teu próprio projeto nela.

Implementa o teu próprio código através do Git

1. Nos detalhes da aplicação, encontra a secção Git / CI-CD e clica em "Ligar GitHub", confirma a instalação da aplicação "Saplo Deploy" e indica o repositório com o projeto Nuxt.
2. O ficheiro saplo.yaml tem de estar no diretório principal do repositório.
3. Faz commit e push do ficheiro saplo.yaml para o branch de produção (por predefinição main).
4. Cada git push subsequente para este branch inicia a construção e o reinício do serviço, o estado é visível no separador Deployments.
5. O Saplo verifica a presença do ficheiro .output/server/index.mjs após a construção - se não existir, o deployment termina com um erro em vez de substituir a versão em funcionamento por uma danificada.

Exemplo de um ficheiro saplo.yaml mínimo para Nuxt:

name: my-project
stack: nuxt
runtime:
  node: "22"
build:
  install: npm ci
  command: npm run build
start:
  command: node .output/server/index.mjs
  port: 3000

Nuxt na Saplo vs. alternativas

Perguntas frequentes

Posso gerar uma versão totalmente estática em vez de SSR? Sim, o nuxt generate fornece um output estático - então, no catálogo de aplicações, seleciona a stack 'static' em vez de Nuxt.

Quantos MB de RAM o Nuxt precisa na prática? O manifesto da receita indica um mínimo de 512 MB, mas sob tráfego de produção real, é melhor planear um Box L para que o processo SSR tenha uma margem para picos de carga.

O Nuxt 3 também funciona, já que o scaffold gera o Nuxt 4? Sim, a instalação a partir do catálogo cria um esqueleto inicial do Nuxt 4, mas podes implementar o teu próprio projeto Nuxt 3 através do git push sem quaisquer alterações - a build e o processo de inicialização funcionam da mesma forma.

O que acontece se a build falhar? A versão anterior da aplicação que está a funcionar permanece no lugar, a Saplo não a substitui por uma versão corrompida.

Terei SSL e o meu próprio domínio? Sim, o certificado SSL é automático, e um domínio ou subdomínio *.saploapp.pl está incluído no preço de qualquer plano.

No Saplo, instalas o Nuxt do zero até um domínio a funcionar em alguns minutos, e cada git push subsequente reinicia o serviço com uma nova versão sem a tua intervenção. Se o projeto não precisar de SSR, a stack 'static', mais leve e barata de manter, aguarda no mesmo catálogo.