8

I need to config server port for Nuxt3. I try to do it so:

nuxt.config.ts

import { defineNuxtConfig } from 'nuxt3'

export default defineNuxtConfig(
  vite: {
    server: {
      port: 5000,
    },
  },
})

But it doesn't work. How to set server port in Nuxt3?

kissu
  • 40,416
  • 14
  • 65
  • 133
Nikita Konyshev
  • 93
  • 1
  • 1
  • 6
  • Btw, as a side note since the RC1, you only need `import { defineNuxtConfig } from 'nuxt'` (no need for `nuxt3`). As shown here: https://nuxtjs.org/announcements/nuxt3-rc/#vite--webpack – kissu May 06 '22 at 16:02

7 Answers7

11

As told here, this is currently not supported.

Change it like this

{
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev --port=5678", // here
    "generate": "nuxt generate",
    "preview": "nuxt preview"
  },
  "devDependencies": {
    "nuxt": "3.0.0-rc.1"
  }
}

Here is how to change the port for production: https://github.com/nuxt/framework/discussions/1884#discussioncomment-1631668

kissu
  • 40,416
  • 14
  • 65
  • 133
7

As of the time of writing the answer, you can now define the port in your nuxt.config as follows:

export default defineNuxtConfig({
  devServer: {
    port: 3001,
  },
})

Source

Mansehej Singh
  • 71
  • 1
  • 2
3

My solution for dev and production mode in all platforms (windows, Linux, MacOS) :

  1. Install the cross-env to support cross platforms.
sudo npm i cross-env -g
  1. Edit your project package.json
{
  "private": true,
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev --port=8001",
    "generate": "nuxt generate",
    "preview": "cross-env PORT=8001 node .output/server/index.mjs"
  },
  "devDependencies": {
    "nuxt": "3.0.0-rc.4"
  },
}
  1. Run the app
yarn run preview
Gedeon Mutshipayi
  • 2,871
  • 3
  • 21
  • 42
3

If you are using PM2, set the port on ecosystem.config.js

module.exports = {
  apps: [
    {
      name: 'NuxtAppName',
      exec_mode: 'cluster',
      instances: 'max',
      script: './.output/server/index.mjs',
    port: 5000
    }
  ]
}
kissu
  • 40,416
  • 14
  • 65
  • 133
Shadrachodek
  • 141
  • 1
  • 5
2

You can use like this in your ecosystem.config.js:

module.exports = {
  apps: [
    {
      name: 'NuxtApp',
      port: 3001,
      exec_mode: 'cluster',
      instances: '1',
      script: './.output/server/index.mjs',
      args: 'preview',
    },
  ],
}
Tyler2P
  • 2,324
  • 26
  • 22
  • 31
Elzodxon Sharofaddinov
  • 51
  • 6
1

Create a .env file in your project root:

PORT=5000

By doing that, you set the PORT environment variable which Nuxt picks up at start.

exmaxx
  • 3,252
  • 28
  • 27
0

It's true, even though theoretically you could do

Server: {
   port: 'xxxx'
}

or host: '0' in order to expose to the local network, in the definition of server you can see:

Use environment variables or top level server options to configure Nuxt server.

server?: Omit<ServerOptions, 'port' | 'host'>;

So even if you set those, they won't be taken into account.

Solve like @kissu said by changing package.json to something like
"dev": "nuxt dev --host=0 --port=3000"

kordoulakis
  • 1
  • 2