Comment définir le port dans next.js

Question

Une application s'exécute sur le port 3000 et je veux exécuter une autre application sur un port différent du port par défaut. Comment puis-je changer cela dans React Next.js. Mon script package.js est

"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "dev": "next",
    "build": "next build",
    "start": "next start"
  },

et la commande de script de démarrage est npm run dev

Answer 1

Définir le numéro de port dans le script npm n'est pas une bonne idée du tout.

Depuis le terminal, vous pouvez passer le numéro de port en utilisant la commande suivante

SET PORT=3001 && npm start

Answer 2

Une solution de contournement en utilisant des variables d'environnement via un fichier .env

Merci à ce commentaire github

Pour le développement

1. Créez un script pour votre environnement de développement à la racine du projet, par exemple dev-server.js

   // dev-server.js require('dotenv').config(); // require dotenv const cli = require('next/dist/cli/next-dev');

   cli.nextDev(['-p', process.env.PORT || 3000]);

2. Ensuite, vous pouvez définir un port personnalisé dans votre fichier .env comme ceci : PORT=3002

3. Modifiez la commande de développement dans votre package.json pour utiliser le script dev-server.js comme ceci :

   "scripts": { "dev": "node dev-server.js" }

4. Exécutez npm run dev et l'application NextJS démarrera sur le port 3002.

Pour la production

1. Créez un script pour votre environnement de production à la racine du projet, par exemple prod-server.js

   // prod-server.js require('dotenv').config(); // require dotenv const cli = require('next/dist/cli/next-start');

   cli.nextStart(['-p', process.env.PORT || 3000]);

2. Ensuite, vous pouvez définir un port personnalisé dans votre fichier .env comme ceci : PORT=3002

3. Modifiez la commande de démarrage dans votre package.json pour utiliser le script prod-server.js comme ceci :

   "scripts": { "build": "next build", "start": "node prod-server.js" }

4. Exécutez npm run start et l'application NextJS démarrera sur le port 3002. (N'oubliez pas de construire le projet auparavant avec npm run build)

dotenv doit être installé via npm install dotenv, requis et configuré dans les scripts comme vu dans les extraits de code précédents.

Note du commentaire github:

Il y a certains fournisseurs d'hébergement qui nous obligent à avoir un fichier server.js/index.js. Le bonus de la solution ci-dessus est qu'elle ne nécessite aucune dépendance supplémentaire.