DEV Community

Cover image for Change default Next.js app Port
Nikit Singh
Nikit Singh

Posted on • Updated on • Originally published at overcompiled.com

Change default Next.js app Port

Wanting to change the default port for your Next.js app is a very common problem. If any other app or process is running on port 3000, you will get this error in your terminal

Port 3000 is already in use.
error Command failed with exit code 1.
Enter fullscreen mode Exit fullscreen mode

Solution

There are 2 ways to go about solving this.

  1. First is to give it a temporary port number. This is useful when you want to run your Next.js app on another port for a single time.
npm run dev -p 3040
Enter fullscreen mode Exit fullscreen mode

or

yarn dev -p 3040
Enter fullscreen mode Exit fullscreen mode

This will run your app on port 3040 for this particular session. Once you close the process you will have to write this again if you want it on port 3040.

  1. The Second method is to set it inside your package.json's script section.
"scripts": {
    "dev": "next -p 3040", // This will change it for dev environment
    "build": "next build",
    "start": "next start -p 3040" // This will change it for the production
}
Enter fullscreen mode Exit fullscreen mode

Now just run

npm run dev
Enter fullscreen mode Exit fullscreen mode

or

yarn dev
Enter fullscreen mode Exit fullscreen mode

Happy to be of help. :)

Top comments (0)