Faça o deploy do seu site Astro na Netlify

Netlify oferece hospedagem e serviços de backend serverless para aplicações web e sites estáticos. Qualquer site Astro pode ser hospedado na Netlify!

Esse guia inclui instruções para fazer o deploy na Netlify através da interface do site ou da CLI da Netlify.

Configuração do Projeto

Você pode fazer o deploy do seu projeto Astro na Netlify de três maneiras diferentes: como um site estático, como um site renderizado no servidor ou como um site renderizado na Edge.

Site Estático

Seu projeto Astro é um site estático por padrão. Você não precisa de nenhuma configuração adicional para fazer o deploy de um site Astro estático na Netlify.

Adaptador para SSR

Para habilitar o SSR em seu projeto Astro e fazer o deploy na Netlify, incluindo uso de funções na Edge pela Netlify:

Adicione o adaptador para Netlify para habilitar o SSR em seu projeto Astro com o comando astro add a seguir. Isso irá instalar o adaptador e fazer as alterações apropriadas em seu arquivo astro.config.mjs em apenas um passo.

npx astro add netlify

Se preferir instalar o adaptador manualmente, conclua os dois passos a seguir:

Instale o adaptador @astrojs/netlify nas dependências do seu projeto usando seu gerenciador de pacotes preferido. Se você está utilizando o npm ou não tem certeza, execute em seu terminal:
Terminal window
```
  npm install @astrojs/netlify
```

Adicione duas novas linhas ao seu arquivo de configuração do projeto astro.config.mjs.

import { defineConfig } from 'astro/config';
import netlify from '@astrojs/netlify/functions';

export default defineConfig({
  output: 'server',
  adapter: netlify(),
});

Você também pode fazer o deploy do seu projeto utilizando Edge Functions da Netlify adicinando edgeMiddleware: true na configuração do adaptador Netlify.

import { defineConfig } from 'astro/config';
import netlify from '@astrojs/netlify/functions';
export default defineConfig({
  output: 'server',
  adapter: netlify({
    edgeMiddleware: true
  }),
});

Como fazer o deploy

Você pode fazer o deploy na Netlify através da interface do site ou da CLI (interface de linha de comando) da Netlify. O processo é o mesmo para sites Astro estáticos e SSR.

Deploy através da interface do site

Se o seu projeto está armazenado no GitHub, GitLab, BitBucket ou Azure DevOps, você poderá utilizar a interface do site da Netlify para fazer o deploy do seu site Astro.

Clique em Add a new site em seu painel de controle da Netlify
Escolha Import an existing project

Quando você importa seu repositório Astro do seu provedor Git, a Netlify deve detectar e pré-preencher automaticamente as configurações corretas para você.
Certifique-se de que as seguintes configurações foram inseridas, e então clique no botão Deploy:
- Build Command: astro build ou npm run build
- Publish directory: dist

Depois de fazer o deploy você será redirecionado para a página de visão geral do site. Lá você pode editar os detalhes de seu site.

Quaisquer alterações futuras no seu repositório de origem acionarão deploys de visualização e produção baseados em sua configuração de deploy.

Arquivo `netlify.toml`

Opcionalmente, você pode criar um arquivo netlify.toml na raiz do repositório do seu projeto para configurar o seu comando de build e o diretório de publicação, bem como outras configurações de projeto, incluindo variáveis de ambiente e redirecionamentos. A Netlify lerá este arquivo e configurará automaticamente o seu deploy.

Para definir as configurações padrão, crie um arquivo netlify.toml com o seguinte conteúdo:

[build]
  command = "npx pnpm install --store=node_modules/.pnpm-store && npm run build"
  publish = "dist"

📚 Mais informações em “Deploying an existing Astro Git repository” no blog da Netlify

Deploy pela CLI

Você também pode criar um site na Netlify e vincular o seu repositório Git instalando e usando a CLI da Netlify.

Instale a CLI da Netlify globalmente
Terminal window
```
npm install --global netlify-cli
```
Execute netlify login e siga as instruções para fazer login e autorizar a Netlify
Execute netlify init e siga as instruções
Confirme o seu comando de build (astro build)

A CLI detectará automaticamente as configurações de build (astro build) e o diretório de deploy (dist) e oferecerá a geração automática do arquivo netlify.toml com estas configurações.
Faça o build e o deploy fazendo push para o Git

A CLI adicionará um chave de deploy ao repositório, o que significa que o seu site será reconstruído automaticamente na Netlify toda vez que você executar git push.

📚 Mais detalhes da Netlify em Deploy an Astro site using the Netlify CLI

Defina uma versão do Node.js

Se você está usando uma imagem de build legada (Xenial) na Netlify, certifique-se de que a versão do Node.js está definida. Astro requer v18.14.1 ou superior.

Você pode especificar a versão do Node.js na Netlify usando:

um arquivo .nvmrc em seu diretório base.
a variável de ambiente NODE_VERSION na configuração do seu site usando o painel geral da Netlify.

Usando as Netlify Functions

Nenhuma configuração especial é necessária para usar as funções da Netlify com Astro. Adicione o diretório netlify/functions na raiz de seu projeto e siga a documentação das Netlify Functions para começar!