Узнайте, как изменить порт, на котором работает Next.js в режиме разработки.
Меня спросили, как изменить HTTP-порт приложения, созданного с использованием Next.js, когда вы запускаете его локально. По умолчанию порт3000
, но это часто используемый порт, и, возможно, у вас есть другая служба, работающая на нем.
Как вы можете это изменить?
Ответ вpackage.json
файл, хранящийся в основной папке приложения Next.js.
По умолчанию содержимое файла следующее:
{
"name": "learn-starter",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start"
},
"dependencies": {
"next": "9.3.5",
"react": "16.13.1",
"react-dom": "16.13.1"
}
}
Примечание: точные номера пакетов будут отличаться в вашем случае, поскольку они будут обновляться.
Вам нужно изменитьscripts
часть.
Изменять:
"dev": "next dev",to
"dev": "next dev -p 3001"to start Next.js on port 3001
instead of 3000
.
Now when you run npm run dev
, the command used to start the development server locally, you will see it start on port 3001
:

Download my free Next.js Handbook
More next tutorials:
- Getting started with Next.js
- Next.js vs Gatsby vs create-react-app
- How to install Next.js
- Linking two pages in Next.js using Link
- Dynamic content in Next.js with the router
- Feed data to a Next.js component using getInitialProps
- Styling Next.js components using CSS
- Prefetching content in Next.js
- Using the router to detect the active link in Next.js
- View source to confirm SSR is working in Next.js
- Next.js: populate the head tag with custom tags
- Deploying a Next.js application on Now
- Next.js: run code only on the server side or client side in Next.js
- Deploying a Next.js app in production
- How to analyze the Next.js app bundles
- Lazy loading modules in Next.js
- Adding a wrapper component to your Next.js app
- The icons added by Next.js to your app
- The Next.js App Bundles
- How to use the Next.js Router
- How to use Next.js API Routes
- How to get cookies server-side in a Next.js app
- How to change a Next.js app port