Port 3000 is already in use Error every time I restart npm run dev

Question

I am using nextjs on vscode. I use npm run dev to start my server in localhost:3000 and then use ^Z to suspend npm run dev . I then use npm run dev to start my server again but get the following error

Port 3000 is already in use.
npm ERR! code 1
npm ERR! path /Users/lee33ya/Desktop/game
npm ERR! command failed
npm ERR! command sh -c next dev

After closing vscode and running npm run dev again, everything works fine. But it's really annoying to close out vscode just so I can do npm run dev again. I've tried killing the port but the problem persists. (After running npm run dev , suspending, and running npm run dev the error repeats). Below is the log of the full error

0 verbose cli [ '/usr/local/bin/node', '/usr/local/bin/npm', 'run', 'dev' ]
1 info using npm@7.5.4
2 info using node@v12.18.4
3 timing config:load:defaults Completed in 5ms
4 timing config:load:file:/usr/local/lib/node_modules/npm/npmrc Completed in 2ms
5 timing config:load:builtin Completed in 2ms
6 timing config:load:cli Completed in 2ms
7 timing config:load:env Completed in 0ms
8 timing config:load:file:/Users/lee33ya/Desktop/game/.npmrc Completed in 1ms
9 timing config:load:project Completed in 1ms
10 timing config:load:file:/Users/lee33ya/.npmrc Completed in 0ms
11 timing config:load:user Completed in 0ms
12 timing config:load:file:/usr/local/etc/npmrc Completed in 0ms
13 timing config:load:global Completed in 1ms
14 timing config:load:cafile Completed in 0ms
15 timing config:load:validate Completed in 0ms
16 timing config:load:setUserAgent Completed in 1ms
17 timing config:load:setEnvs Completed in 1ms
18 timing config:load Completed in 14ms
19 verbose npm-session 14f27a79b0b3ed1a
20 timing npm:load Completed in 23ms
21 timing command:run-script Completed in 1973ms
22 verbose stack Error: command failed
22 verbose stack     at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/@npmcli/promise-spawn/index.js:64:27)
22 verbose stack     at ChildProcess.emit (events.js:315:20)
22 verbose stack     at maybeClose (internal/child_process.js:1021:16)
22 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:286:5)
23 verbose pkgid game@0.1.0
24 verbose cwd /Users/lee33ya/Desktop/game
25 verbose Darwin 20.2.0
26 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "dev"
27 verbose node v12.18.4
28 verbose npm  v7.5.4
29 error code 1
30 error path /Users/lee33ya/Desktop/game
31 error command failed
32 error command sh -c next dev
33 verbose exit 1

Below is my package.json

{
  "name": "game",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": {
    "next": "10.0.6",
    "react": "17.0.1",
    "react-dom": "17.0.1"
  },
  "devDependencies": {
    "@types/node": "^14.14.27",
    "@types/react": "^17.0.2",
    "typescript": "^4.1.5"
  }
}

I've used nextjs on my other projects and this issue only appeared recently...what am I doing wrong?

Answer 1

This is because ^Z does not stop the process but just put it in sleep that's why running npm run dev says the port is already in use. Use ^C instead

Answer 2

When I open vs code, I also get this problem. I think reason is vscode extension. And I turn off eslint, (and other extension which relative JS code).
Final, This work for me, p/s: With do that, U can start server and go to turning vs-code extension on.
Big Hug.