close
How to Set port in next.js, Set port in next.js, Use Different Port In Nextjs, Set different port in next.js, Different Port In Nextjs

How to Set port in next.js

by

Hello Guys, If You are running Nextjs Project then its Default port is 3000 when we run npm run dev our nextjs app is live on http://localhost:3000 But what if You want to run it on a different port? then? Then This Article is for You. We are going to learn How to Set port in next.js?. Lets get started with this article without wasting your time.

Contents
  1. How to Set port in next.js?
  2. Solution 1: Add this line
  3. Solution 2: For Npx users
  4. Solution 3: For Yarn Users
  5. Conclusion

How to Set port in next.js?

  1. How to Set port in next.js

    To Set port in next.js If You are Using npx then You can run your nextjs project with -p parameter that is your port just like this npx next dev -p your_port For example I want to use port number 5555 then I should run this command: npx next dev -p 5555 Now, Your Nextjs Project is set to run on port 5555. Thanks.

  2. Set port in next.js

    To Set port in next.js If You want to run your nextjs project on a different port then you need to edit this package.json file. And Edit the Script section and add dev and start just like this. If we need to run our next project on port 5555 then we need to set dev in script just like next dev -p 5555 just like below: dev”: “next dev -p 5555” And now You can run npm run dev for a development environment: npm run dev And You are working in a Production environment then You need to run npm start and Then you can access your project on http://localhost:5555. And Now, Your NextJs Project is Set on Different Port.

Solution 1: Add this line

If You want to run your nextjs project on a different port then you need to edit this package.json file. And Edit the Script section and add dev and start just like this. If we need to run our next project on port 5555 then we need to set dev in script just like next dev -p 5555 just like below.

"scripts": {
    "dev": "next dev -p 5555", // Developnent Environment
    "start": "next start -p 5555" // Production Environment
},

And now You can run npm run dev for a development environment.

npm run dev

And You are working in a Production environment then You need to run npm start

npm start

and Then you can access your project on http://localhost:5555. And Now, Your NextJs Project is Set on Different Port.

Solution 2: For Npx users

If You are Using npx then You can run your nextjs project with -p parameter that is your port just like this npx next dev -p your_port For example I want to use port number 5555 then I should run this command.

 npx next dev -p 5555

Now, Your Nextjs Project is set to run on port 5555. Thanks.

Solution 3: For Yarn Users

If You are using yarn then you need to run yarn dev with -p params which indicate PORT_YOU_WANT_TO_USE. If I want to use Port 5555 then I should run this command.

yarn dev -p 5555

Now, Your nextjs Project Port is Changed to Different Port.

Conclusion

It’s all About Update Dependancy with one command. Hope We Helped you To Update Your Dependency. Comment below Your thoughts and your queries. Also, Comment below which solution worked for you?

Also, Read

Leave a Comment