Preciso de ajuda para usar um adaptador de framework As rotas da API Edge fazem com que minha compilação do Next.js falhe A regeneração estática incremental sob demanda não está funcionando para minha aplicação A saída de compilação da minha aplicação excede o tamanho máximo permitido Minha compilação falha com um erro de falta de memória O tamanho da resposta de HTTP da minha aplicação é muito grande Como faço para medir o tempo de inicialização do meu aplicativo de computação localmente?

Solução de problemas de aplicações renderizadas do lado do servidor

Se você tiver problemas inesperados ao implantar um aplicativo SSR com a computação do Amplify Hosting, consulte os tópicos de solução de problemas a seguir. Se você não encontrar uma solução para seu problema aqui, consulte o guia de solução de problemas de computação na web do SSR no repositório Amplify Hosting Issues. GitHub

Tópicos

Preciso de ajuda para usar um adaptador de framework
As rotas da API Edge fazem com que minha compilação do Next.js falhe
A regeneração estática incremental sob demanda não está funcionando para minha aplicação
A saída de compilação da minha aplicação excede o tamanho máximo permitido
Minha compilação falha com um erro de falta de memória
O tamanho da resposta de HTTP da minha aplicação é muito grande
Como faço para medir o tempo de inicialização do meu aplicativo de computação localmente?

Preciso de ajuda para usar um adaptador de framework

Se você estiver tendo problemas para implantar uma aplicação de SSR que use um adaptador de framework, consulte Uso de adaptadores de código aberto para qualquer estrutura SSR.

As rotas da API Edge fazem com que minha compilação do Next.js falhe

Atualmente, o Amplify não oferece suporte às rotas da API Edge do Next.js. Você deve usar sistemas não periféricos APIs e middleware ao hospedar seu aplicativo com o Amplify.

A regeneração estática incremental sob demanda não está funcionando para minha aplicação

A partir da versão 12.2.0, o Next.js oferece suporte à Regeneração Estática Incremental (ISR) para limpar manualmente o cache do Next.js de uma página específica. No entanto, o Amplify atualmente não oferece suporte à ISR sob demanda. Se seu aplicativo estiver usando a revalidação sob demanda do Next.js, esse atributo não funcionará quando você implantar seu aplicativo no Amplify.

A saída de compilação da minha aplicação excede o tamanho máximo permitido

Atualmente, o tamanho máximo de saída de compilação com suporte no Amplify para aplicações SSR é de 220 MB. Se você receber uma mensagem de erro informando que o tamanho da saída de compilação da sua aplicação excede o tamanho máximo permitido, tome medidas para reduzi-la.

Para reduzir o tamanho da saída de compilação de uma aplicação, é possível inspecionar os artefatos de criação da aplicação e identificar quaisquer dependências grandes a serem atualizadas ou removidas. Primeiro, baixe os artefatos de compilação para o computador local. Em seguida, verifique o tamanho dos diretórios. Por exemplo, o diretório node_modules pode conter binários como @swc e @esbuild que são referenciados pelos arquivos de runtime do servidor Next.js. Como esses binários não são necessários no runtime, é possível excluí-los após a compilação.

Use as instruções a seguir para baixar a saída de compilação de um aplicativo e inspecionar o tamanho dos diretórios usando a ( AWS Command Line Interface CLI).

Para baixar e inspecionar a saída de compilação de uma aplicação Next.js

Abra uma janela de terminal e execute o comando a seguir. Altere o ID da aplicação, o nome da ramificação e o ID do trabalho para suas próprias informações. Para a ID do trabalho, use o número da compilação com falha que você está investigando.
```
aws amplify get-job --app-id abcd1234 --branch-name main --job-id 2
```

Na saída do terminal, localize o URL dos artefatos pré-assinados na seção job, steps, stepName: "BUILD". O URL é destacado em vermelho no exemplo a seguir.


"job": {
    "summary": {
        "jobArn": "arn:aws:amplify:us-west-2:111122223333:apps/abcd1234/main/jobs/0000000002",
        "jobId": "2",
        "commitId": "HEAD",
        "commitTime": "2024-02-08T21:54:42.398000+00:00",
        "startTime": "2024-02-08T21:54:42.674000+00:00",
        "status": "SUCCEED",
        "endTime": "2024-02-08T22:03:58.071000+00:00"
    },
    "steps": [
        {
            "stepName": "BUILD",
            "startTime": "2024-02-08T21:54:42.693000+00:00",
            "status": "SUCCEED",
            "endTime": "2024-02-08T22:03:30.897000+00:00",
            "logUrl": "https://aws-amplify-prod-us-west-2-artifacts.s3.us-west-2.amazonaws.com/abcd1234/main/0000000002/BUILD/log.txt?X-Amz-Security-Token=IQoJb3JpZ2luX2V...Example

Copie e cole o URL na janela do navegador. Um arquivo artifacts.zip é baixado no computador. Esse é o resultado da compilação.
Execute o comando de uso de disco du para inspecionar o tamanho dos diretórios. O comando de exemplo a seguir retorna o tamanho dos diretórios compute e static.
```
du -csh compute static
```
Veja a seguir um exemplo da saída com informações de tamanho para os diretórios compute e static.
```
 29M    compute
3.8M    static
 33M    total
```
Abra o diretório compute e localize a pasta node_modules. Revise suas dependências em busca de arquivos que você possa atualizar ou remover para diminuir o tamanho da pasta.

Se a sua aplicação incluir binários que não sejam necessários no runtime, exclua-os após a compilação adicionando os comandos a seguir à seção de compilação do arquivo amplify.yml da sua aplicação.


- rm -f node_modules/@swc/core-linux-x64-gnu/swc.linux-x64-gnu.node
- rm -f node_modules/@swc/core-linux-x64-musl/swc.linux-x64-musl.node

Veja a seguir um exemplo da seção de comandos de compilação de um arquivo amplify.yml com esses comandos adicionados após a execução de uma compilação de produção.


frontend:
  phases:
    build:
      commands:
         -npm run build
         
         // After running a production build, delete the files
         - rm -f node_modules/@swc/core-linux-x64-gnu/swc.linux-x64-gnu.node
         - rm -f node_modules/@swc/core-linux-x64-musl/swc.linux-x64-musl.node

Minha compilação falha com um erro de falta de memória

O Next.js permite que você armazene artefatos de compilação em cache para melhorar o desempenho em compilações subsequentes. Além disso, o AWS CodeBuild contêiner do Amplify compacta e carrega esse cache no Amazon S3, em seu nome, para melhorar o desempenho da compilação subsequente. Isso pode fazer com que sua compilação falhe com um erro de falta de memória.

Execute as ações a seguir para evitar que seu aplicativo exceda o limite de memória durante a fase de compilação. Primeiro, remova .next/cache/**/* da seção cache.paths das suas configurações da compilação. Em seguida, remova a variável de ambiente NODE_OPTIONS do seu arquivo de configurações da compilação. Em vez disso, defina a variável de ambiente NODE_OPTIONS no console do Amplify para definir o limite máximo de memória do nó. Para mais informações sobre como configurar as variáveis de ambiente usando o console do Amplify, consulte Configurar variáveis de ambiente.

Depois de fazer essas alterações, tente sua versão novamente. Se for bem-sucedido, adicione .next/cache/**/* novamente à seção cache.paths do seu arquivo de configurações da compilação.

Para obter mais informações sobre a configuração do cache do Next.js para melhorar o desempenho da compilação, consulte AWS CodeBuild no site do Next.js.

O tamanho da resposta de HTTP da minha aplicação é muito grande

Atualmente, o tamanho máximo de saída de compilação que o Amplify oferece suporte para aplicações Next.js 12 e posteriores usando a plataforma Web Compute é de 5,72 MB. As respostas acima desse limite retornam erros 504 sem conteúdo para os clientes.

Como faço para medir o tempo de inicialização do meu aplicativo de computação localmente?

Use as instruções a seguir para determinar o horário local de inicialização/inicialização do seu aplicativo de computação Next.js 12 ou posterior. Você pode comparar o desempenho do seu aplicativo localmente com o da Amplify Hosting e usar os resultados para melhorar o desempenho do seu aplicativo.

Para medir localmente o tempo de inicialização de um aplicativo de computação Next.js

Abra o next.config.js arquivo do aplicativo e defina a output opção da standalone seguinte forma.


** @type {import('next').NextConfig} */
const nextConfig = {
  // Other options
  output: "standalone",
};

module.exports = nextConfig;

Abra uma janela de terminal e execute o comando a seguir para criar o aplicativo.
```
next build
```
Execute o comando a seguir para copiar a .next/static pasta para .next/standalone/.next/static o.
```
cp -r .next/static .next/standalone/.next/static
```
Execute o comando a seguir para copiar a public pasta para .next/standalone/public o.
```
cp -r public .next/standalone/public
```
Execute o comando a seguir para iniciar o servidor Next.js.
```
node .next/standalone/server.js
```
Observe quanto tempo leva entre a execução do comando na etapa 5 e a inicialização do servidor. Quando o servidor estiver escutando em uma porta, ele deverá imprimir a seguinte mensagem.
```
Listening on port 3000
```
Observe quanto tempo leva para qualquer outro módulo ser carregado após a inicialização do servidor na etapa 6. Por exemplo, bibliotecas como essas bugsnag levam de 10 a 12 segundos para serem carregadas. Depois de carregado, ele exibirá a mensagem de confirmação[bugsnag] loaded.
Adicione as durações de tempo da etapa 6 e da etapa 7. Esse resultado é o horário de inicialização/inicialização local do seu aplicativo Compute.

Atenção O Javascript está desativado ou não está disponível no seu navegador.

Para usar a documentação da AWS, o Javascript deve estar ativado. Consulte as páginas de Ajuda do navegador para obter instruções.

Convenções do documento

Domínios personalizados

Redirecionamentos e regravações