Nextjs
Published in

Nextjs

Nextjs

How to change the port in nextjs?

Change the port in nextjs with the easy way.

How to change the port in nextjs?
How to change the port in nextjs?

You can change port in nextjs very quickly. With two methods, you can change the port in nextjs.

  1. Change port with nextjs script
  2. Change port with NPM and YARN

Change port with nextjs script

Simple, you can change the port inside your package.json file in the script section. Make sure to change the port with -p flag in nextjs scripts.

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

You also change the port for different environments like dev, build and start in nextjs.

"scripts": {"dev": "next -p 3002","build": "next build","start": "next start -p 3005",},

Note

I will never suggest using the script method to change port in next.js.

Change port with NPM and YARN.

The second way is the easy way to change the port in the nextjs. You use npm and yarn command line cli to change the port name in nextjs. It is a straightforward process.

Benefits

  1. You can run multiple nextjs servers for different ports help of cli.
  2. They can Run the nextjs build, start and dev environments of other ports.

Yarn

Inside YARN, you use -p flag to add a dynamic port for your nextjs app.

yarn dev -p 3002

NPM

Inside NPM, you use -p flag to add a dynamic port for your nextjs app.

npm run dev -- -p 3002

Note For NPM

npm run dev -p 3002

If you pass -p flag without -- in your npm cli, you face an error. The error tells you you are missing the 3002 js file in your folder.

A simple word without — 3002 treated as a js file in npm

Previous articles

Conclusion

I'm recommended the second method for everyone. It is a straightforward process. If config something like a database and any other services, I defiantly guide you to use the first method.

Note

In the First method, you run only one server in one environment(NPM Scripts ).

If you have any queries or need my help, don't hesitate to contact me at officialrajdeepsingh[@]gmail.com. Are you migrating React to Next.js? You can also contact me and follow the Next.js publication.

Feel free to like and share my article with others if you like my writing. You also tag on Twitter official_R_deep.

https://officialrajdeepsingh.dev/

Read More content at Nextjs. Sign up for a free newsletter and join the nextjs community on medium.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Rajdeep singh

Rajdeep singh

JavaScript || Reactjs || Nextjs || Python || Rust || Biotechnology || Bioinformatic || Front-end Developer || Writer || https://officialrajdeepsingh.dev/