Como instalar o SvelteKit no Saplo (aplicação leve com SSR)

O SvelteKit é diferente do React e do Vue já ao nível do compilador - os componentes transformam-se em JavaScript puro durante a compilação, sem o DOM virtual a ser carregado no navegador. O resultado é um bundle mais pequeno e um arranque mais rápido, especialmente percetível em telemóveis mais fracos e ligações mais lentas. Com o adaptador Node, o SvelteKit funciona como SSR - um processo de longa duração análogo ao Next.js ou Nuxt, não apenas um diretório com ficheiros estáticos. No Saplo, executas o SvelteKit como um serviço gerido com reinício automático.

Para quem é o SvelteKit na Saplo

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

• aplicação onde o peso do bundle é importante - menos JavaScript para transferir e analisar do que numa aplicação React ou Vue comparável,
• página com interação real, não apenas conteúdo - o SvelteKit funciona bem tanto em páginas simples como em aplicações complexas,
• projeto direcionado para ligações mais lentas e telemóveis - um bundle mais pequeno reduz o tempo de interação,
• queres implementações com git push em vez de configuração manual do processo Node - ligas o repositório uma vez e a Saplo constrói e reinicia o serviço automaticamente.

Precisas apenas de um SPA leve sem SSR? Verifica no catálogo de aplicações um stack Svelte separado (Vite, sem processo em segundo plano) - esta é uma variante diferente do SvelteKit descrito neste tutorial.

Requisitos

Para instalares o SvelteKit na Saplo, precisas de:

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

Instalação passo a passo

1. No Painel Saplo, acede ao Catálogo de aplicações e seleciona SvelteKit (categoria "Aplicações").
2. Indica um Box do plano L ou superior e o nome da aplicação - este será usado para criar o subdomínio padrão.
3. Escolhe a versão Node.js para a construção (18, 20 ou 22, por defeito 20) e confirma a instalação.
4. O motor cria um projeto SvelteKit mínimo, instala e substitui o padrão adapter-auto por @sveltejs/adapter-node em svelte.config.js, constrói o projeto para o diretório build/ e executa-o através do supervisor na porta 3000, e o nginx encaminha o tráfego do domínio para esta porta.
5. Após a conclusão da instalação, o domínio do passo 2 mostra a página inicial do SvelteKit - a partir deste momento, podes implementar o teu próprio código.

Implementação de código próprio via 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 SvelteKit.
2. Certifica-te de que o projeto tem o @sveltejs/adapter-node instalado em svelte.config.js - sem ele, a build irá gerar uma versão para outro ambiente, não para um processo Node de longa duração.
3. Na diretoria raiz do repositório, coloca o ficheiro saplo.yaml e envia-o para o branch de produção (por defeito, main).
4. Cada git push subsequente para este branch inicia a build e reinicia o serviço; podes ver o estado no separador Deployments.
5. A build cria a diretoria build/ com o servidor Node, que o Saplo executa como um serviço gerido.

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

name: my-project
stack: sveltekit
runtime:
  node: "22"
build:
  install: npm ci
  command: npm run build
start:
  command: node build
  port: 3000

SvelteKit na Saplo vs. as alternativas

Perguntas Frequentes

Qual é a diferença entre o SvelteKit e o stack Svelte normal no catálogo? O SvelteKit com o adaptador Node é SSR - um processo de longa duração. O stack Svelte é um SPA puro, construído com Vite, sem processo em segundo plano, mais leve de manter, mas sem renderização do lado do servidor.

Preciso substituir manualmente o adaptador pelo Node no meu próprio projeto? Se o teu projeto tiver o adapter-auto predefinido, substitui-o por @sveltejs/adapter-node antes da primeira implementação via git - caso contrário, a construção gerará uma versão para outro ambiente.

Quanto de RAM o SvelteKit 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 reserva para picos de carga.

O que acontece se a construção falhar? A versão anterior em funcionamento da aplicação permanece no lugar, o Saplo não a substitui por uma versão com erros.

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

Com o SvelteKit no Saplo, podes criar um domínio do zero em poucos 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, verifica o stack Svelte, que é mais leve, no mesmo catálogo.