heroku nextjs

Next.js em Heroku

Implantar aplicativos universais baseados em React no Heroku.

Implantação de demonstração deste repo:
https://nextjs.herokuapp.com

Um nó personalizado/servidor expresso é suportado. Use -o para:

• Combine uma API do nó com uma interface de usuário seguinte/react
• Implementar rotas de URL personalizadas

▶ ️ Em seguida com servidor expresso personalizado

Requer

• Heroku
  • Ferramentas de linha de comando (CLI)
  • uma conta gratuita
• git
• Node.js
• Next.js

Implantação de produção

Depois de ter um próximo aplicativo funcionando localmente, você pode implantá -lo para acesso público.

1. Revise o script npm start para definir o ouvinte da web $PORT :

   Mesclar esta entrada no package.json :

   {
     "scripts" : {
       "dev" : " next " ,
       "build" : " next build " ,
       "start" : " next start -p $PORT "
     }
   }

   ️ Em março de 2019, a Heroku começou a executar npm run build automaticamente; portanto, a antiga entrada de script heroku-postbuild não é mais necessária.

2. Verifique se o aplicativo é um repositório Git, ignorando os diretórios somente local:

   git init
   (echo node_modules/ && echo .next/) >> .gitignore

3. Crie o aplicativo Heroku:

   heroku create $APP_NAME

4. Implantar:

   git add .
   git commit -m ' Next.js app on Heroku '
   git push heroku main 

   ️ Em julho de 2020, a Heroku apoia git push heroku main e incentiva seu uso. O suporte ao nome do ramo de 'Master' permanecerá disponível para compatibilidade com versões anteriores.

5. ♻️ Alterações de implantação: adicione, comprometa e empurre novamente.

Config personalizado

Em seguida, o próprio suporta a configuração Build & RunTime através do arquivo next.config.js.

Use variáveis de ambiente (heroku config vars) dentro de seus componentes do React, não é necessário reconstruir! Simplesmente defina os valores Next.config.js no ambiente do servidor usando o objeto process.env .