Create-react-app: Something is already running on port 3000 ! why

[lxlneo]

But nothing is already running on port 3000!!!!!

if "127.0.0.1 localhost" is not in your host.
when you run yarn start . it tell you Something is already running on port 3000 ....

see detect-port#L58

the error msg should more friendly.

[Timer]

This is done purposefully because something running on the same port but different addresses is confusing at best.

[Timer]

I believe the message is already pretty friendly; it's saying something is running on port 3000 -- not that something is running on localhost:3000.

Can you propose a better message?

[mxmul]

This sounds like a bug to me.

If I run HOST=127.127.4.224 PORT=9080 yarn start, the expected behavior is that the dev server binds to that host and port (like any other web server). It shouldn't matter whether any processes are bound to that port on a different address.

Running different processes on the same port but different addresses could be confusing, but I think it's a necessary feature (especially on multi-user systems). Maybe we could be very explicit in the startup message about which address and port are bound?

[Timer]

Hm, there's a lot of edge cases for this. I'd be open to a proposal better aligned to how this should work.

The problem is that when we bind to localhost, 0.0.0.0, or ::, we have to check many other addresses.
I'd even go as far as ::1 and 127.0.0.1; maybe we can ignore checking the other hosts if it isn't one of these, what do you think?

[mxmul]

I'm probably missing a lot of the complexity, but it seems like the behavior should be:

• If a HOST is provided, only attempt to bind to that address. Otherwise, try to bind to localhost.
• If a PORT is provided, only attempt to listen on that port. Otherwise, search for an open port, starting from 3000.

[hendrasan]

I just had this problem and the quick fix is

Add 127.0.0.1 localhost in your host.

It should be in the docs maybe?

[leonwatson2]

@benhanks040888 adding

127.0.0.1 localhost

in the hosts file

/etc/hosts for mac
C:\Windows\System32\Drivers\etchosts for windows

helped.
Thank you so much sir.

[Timer]

I think we'll be sticking to this default behavior for now -- it makes the most sense IMO.

Mainly because:

This is done purposefully because something running on the same port but different addresses is confusing at best.

[piggy2303]

this work for me
1 open chrome
2 open : localhost:3000
3 write something on your code
4 refesh tab on chrome -> it will crash
5 npm start again
6 done :)

[SeanTankGarvey]

To rephrase what piggy2303 said:

1. Open Chrome (or other browser).
2. Go to: localhost:3000
3. If you see your previous react app still loaded in localhost:3000, then open the src/app.js for that app in a text editor and make some/any change to the source-code.
4. Click refresh tab within the browser/Chrome.
5. Once browser/Chrome crashes/refuses to connect, open the terminal.
6. Navigate to your new intended directory where you were previously unable to run 'npm start' before Step 1.
7. Run 'npm start'.
8. Enjoy!

[shahrukh4]

Just make an .env file at root of your project and add this line,

PORT=3002

and type npm start in cmd again.

[gaearon]

Yep, https://github.com/facebookincubator/create-react-app/issues/2843#issuecomment-358685783 is the right solution if you often work on two apps side by side and want to customize the port for one of them.