As traduções são geradas por tradução automática. Em caso de conflito entre o conteúdo da tradução e da versão original em inglês, a versão em inglês prevalecerá.

Implantando um aplicativo Next.js SSR no Amplify

Por padrão, o Amplify implanta novos aplicativos SSR usando o serviço de computação da Amplify Hosting com suporte para as versões 12 a 15. Next.js A computação do Amplify Hosting gerencia integralmente os recursos necessários para implantar uma aplicação de SSR. Os aplicativos SSR em sua conta do Amplify que você implantou antes de 17 de novembro de 2022 estão usando o provedor SSR Classic Next.js (somente 11).

É altamente recomendável que você migre aplicativos usando SSR clássico (somente Next.js 11) para o provedor de SSR computacional Amplify Hosting. O Amplify não realiza migrações automáticas para você. É necessário migrar manualmente seu aplicativo e, em seguida, iniciar uma nova compilação para concluir a atualização. Para instruções, consulte Migrando um aplicativo de Next.js 11 SSR para a computação do Amplify Hosting.

Use as instruções a seguir para implantar um novo aplicativo Next.js SSR.

Package.json configurações de arquivo

Quando você implanta um Next.js aplicativo, o Amplify inspeciona o script de criação do aplicativo no package.json arquivo para determinar o tipo de aplicativo.

Veja a seguir um exemplo do script de criação de um Next.js aplicativo. O script de compilação "next build" indica que o aplicativo é compatível com páginas SSG e SSR. Esse script de construção também é usado para Next.js 14 ou mais aplicativos somente SSG.

"scripts": {
  "dev": "next dev",
  "build": "next build",
  "start": "next start"
},

Veja a seguir um exemplo do script de criação de um aplicativo SSG de Next.js 13 anos ou anterior. O script de compilação "next build && next export" indica que o aplicativo é compatível somente com páginas SSG.

"scripts": {
  "dev": "next dev",
  "build": "next build && next export",
  "start": "next start"
},

Amplifique as configurações de compilação para um aplicativo SSR Next.js

Depois de inspecionar o arquivo package.json da sua aplicação, o Amplify verifica as configurações da compilação da aplicação. É possível salvar as configurações da compilação no console do Amplify ou em um arquivo amplify.yml na raiz do seu repositório. Para obter mais informações, consulte Definição das configurações de compilação de uma aplicação do Amplify.

Se o Amplify detectar que você está implantando um aplicativo Next.js SSR e nenhum amplify.yml arquivo estiver presente, ele gerará uma especificação de construção para o aplicativo e definirá como. baseDirectory .next Se você estiver implantando um aplicativo em que um arquivo amplify.yml esteja presente, as configurações da compilação no arquivo substituirão todas as configurações da compilação no console. Portanto, é necessário definir manualmente o valor baseDirectory para .next no arquivo.

Veja a seguir um exemplo das configurações da compilação de um aplicativo em que baseDirectory está definido como .next. Isso indica que os artefatos de construção são de um Next.js aplicativo compatível com páginas SSG e SSR.

version: 1
frontend:
  phases:
    preBuild:
      commands:
        - npm ci
    build:
      commands:
        - npm run build
  artifacts:
    baseDirectory: .next
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*

Amplifique as configurações de compilação para um aplicativo SSG de Next.js 13 anos ou anterior

Se o Amplify detectar que você está implantando um aplicativo SSG Next.js 13 ou anterior, ele gera uma especificação de compilação para o aplicativo e define como. baseDirectory out Se você estiver implantando um aplicativo em que um arquivo amplify.yml está presente, deverá definir manualmente o valor baseDirectory para out no arquivo. O out diretório é a pasta padrão Next.js criada para armazenar ativos estáticos exportados. Ao definir as configurações de especificação de compilação da sua aplicação, altere o nome da pasta baseDirectory para corresponder à configuração da sua aplicação.

Veja a seguir um exemplo das configurações de compilação de um aplicativo em que baseDirectory está definido out para indicar que os artefatos de compilação são de um aplicativo de Next.js 13 anos ou anterior que oferece suporte somente a páginas SSG.

version: 1
frontend:
  phases:
    preBuild:
      commands:
        - npm ci
    build:
      commands:
        - npm run build
  artifacts:
    baseDirectory: out
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*

Amplifique as configurações de compilação para um aplicativo Next.js SSG 14 ou posterior

Na Next.js versão 14, o next export comando foi descontinuado e substituído pelo output: 'export' no next.config.js arquivo para permitir exportações estáticas. Se você estiver implantando um aplicativo somente de Next.js 14 SSG no console, o Amplify gera uma especificação de construção para o aplicativo e define como. baseDirectory .next Se você estiver implantando um aplicativo em que um arquivo amplify.yml está presente, deverá definir manualmente o valor baseDirectory para .next no arquivo. Essa é a mesma baseDirectory configuração que o Amplify usa para Next.js WEB_COMPUTE aplicativos que suportam páginas SSG e SSR.

A seguir está um exemplo das configurações de compilação para um aplicativo somente Next.js 14 SSG com o baseDirectory definido como. .next

version: 1
frontend:
  phases:
    preBuild:
      commands:
        - npm ci
    build:
      commands:
        - npm run build
  artifacts:
    baseDirectory: .next
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*