Laravel Mix Version: 6.0.43
Node Version (node -v): 16.13.1
NPM Version (npm -v): 8.1.2
OS: Windows 10 21h2
Description:
THIS IS HAPPENING ON A FRESH NEW INSTALL OF LARAVEL AND MY OTHER PROJECTS
Running npm run hot changes the script tag sources to http://localhost:8080/*/*.* from http://localhost/*/*.* HOWEVER I always get net::ERR_EMPTY_RESPONSE from localhost:8080. The HMR server doesn't launch at all. The terminal output of the command also have no mention of spinning up a new web server.
PS C:\Users\Eric Wang\Documents\GitHub\test-laravel-mix> npm run hot
● Mix █████████████████████████ emitting (95%)
emit
● Mix █████████████████████████ done (99%) plugins
WebpackBar:done
✔ Mix
Compiled successfully in 5.51s
Laravel Mix v6.0.43
✔ Compiled Successfully in 5336ms
┌────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┬──────────┐├────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┼──────────┤│ css/app.css │ 47.6 KiB │└────────────────────────────────────────────────────────────────────────────────────────────────────────────────────┴──────────┘webpack compiled successfully
Here's a picture of the browser failing to fetch the bundle files
Steps To Reproduce:
I am running Docker 4.5.1 using legacy Hyper-V.
I containerized Laravel and PHP BUT not the frontend and JS. I am running Laravel Mix on my main system.
Clone the fresh installation of Laravel from https://github.com/ericwang401/test-laravel-mix
Clone Laradock in the project folder using git clone https://github.com/laradock/laradock.git
CD to the Laradock folder and make .env file with cp .env.example .env
Inside .env file set PHP_VERSION to PHP_VERSION=8.0 AND DO NOT EDIT MYSQL SETTINGS
Now edit the Laravel environment file
DB_CONNECTION=mysql
DB_HOST=mysql
DB_PORT=3306
DB_DATABASE=default
DB_USERNAME=default
DB_PASSWORD=secret
Start up the Laravel app in Laradock folder using docker-compose up -d nginx mysql
Enter into bash mode in the Docker container docker-compose exec workspace bash
Install Composer dependencies BUT NOT NPM DEPENDENCIES YET composer i
Now exit out of the Docker container CNTRL + D
Install NPM dependencies in project root ON YOUR MAIN SYSTEM npm i
Run on your main system npm run hot
Now go to http://localhost and IT SHOULD be a white screen
Check console logs and it should give net::ERR_EMPTY_RESPONSE when it tries to fetch the bundle files
REMEMBER: the backend is running inside Docker
The frontend (Laravel Mix) is running on the host system
This issue is happening on a FRESH project installation of Laravel 9 + Jetstream AND it's also happening on my other older projects like https://github.com/StratumPanel/Stratum-Panel
The HMR server is simply not launching.
I found out the issue. The problem was that the default port, 8080, Laravel Mix HMR was using couldn't be binded to. Webpack Dev Server doesn't respond with a message of failing to bind to a port. To confirm this issue, I replicated the environment on my friend's PC and it too couldn't bind to port 8080, but this time it reported an error that the dev server couldn't bind to port 8080.
I fixed this issue by specifying
mix.options({
hmrOptions: {
host: 'localhost',
port: 4206
}
});
And it works! On both my friend's pc and my pc.
I used the exact same reproduction instructions on my friend's PC.
I spent way too long investigating this issue 😭
I have this Dockerfile
FROM node:14
WORKDIR /app
COPY package.json .
RUN npm install
COPY . .
EXPOSE 3000
CMD [ "node", "app.mjs" ]
And I can successfully run
docker run hello-world
on my ubuntu 20.10 OS.
So I am assuming that docker is installed successfully.
But when I tried to run
docker build .
It gives me this error
This is not something with the npm. I can locally install the dependencies without any issue. I assume Dokcer can't access npm registry to pull the npm packages. Something to do with networks I guess.
How do I fix this issue?
This is my code
https://github.com/Enuri-Information-Systems/docker-test
Depending on the network configuration it could happen that you run into problems that the container is not able to connect to a server to download data. This can have various reasons and also depends on how you run docker.
One common thing is that your network requires the usage of a proxy. But only having the error message it is not possible to tell what the exact reason in your case is.
One solution to that problem is to specify the network mode. Adding --network host as an option should most of the time work.
So running your build command that way docker build --network=host . should work.
I keep on getting "? Something is already running on port 3000" message in my terminal when I start up my react server when there is absolutely nothing running on my port 3000
What I have tried to solve with:
Restart the macOS.
checking my "http://localhost:3000" on chrome browser. (Nothing: This site can’t be reached)
Go to chrome://serviceworker-internals and chrome://appcache-internals, search for localhost:3000 (Nothing found)
I also tried almost every command lines I found on Google regarding this issue
I also created another express.js app, and it was successfully launch on port 3000 while React said there is something running on 3000. React on my computer just keeping thinking there is something running on port 3000.
If you are a windows user you can try using
npx kill-port 3000
in your console. I was having the same problem and it worked for me.
Not sure about MAC.
Open cmd and write this
netstat -a -o -n
You will get list of active connections then find 3000 by hitting
Cntrl + f
Copy the PID of that port and hit this command
taskkill /F /PID PID_of_port
Edit
This guide is for windows.
Kill Node.Js process from Task Manager.
Step 1: Open Task Manager by clicking ctrl+shift+delete
Step 2: Open Prcesses tab
Step 3: Search for Node.JS process and right click on that then click on End Task
Step 4: Now you can start again.
As #khurram khan suggested terminating the process may be the best option for you, This work for me on linux:
$ lsof -i tcp:3000
$ kill -9 PID
the first command should give you the PID number to enter in the second command as PID.
I had this problem on Mac and I solved by running:
npx kill-port 3000
I had stuck with this one for few hours, and the end I had found the solution
There was incorrect mapping to the local host in the hosts file and didn't had any relation to the port taken something like
10.2.224.130 localhost
Just Change it back to
127.0.0.1 localhost
Host file locations
https://www.howtogeek.com/howto/27350/beginner-geek-how-to-edit-your-hosts-file/
In case anyone comes across this and the above solutions didn't help, make sure your /etc/hosts has:
127.0.0.1 localhost
For some reason this was wiped from my hosts file and CRA's dependency for checking ports (detect-port-alt) checks localhost:[PORT] to see if it's available. If it errors out, you'll always get the "Something is already running..." error when checking a specific port but not when using a random port (since that's picked by the dependency).
kill node.js from the background processes. that would soleve the probelem. alterntively, you could restart your system
for window use this in package.json
"start": "set PORT=3006 && react-scripts start"
for Linux and MacOS
"start": "PORT=3006 react-scripts start"
This worked for me on windows pc. This one is for those are not seeing the port when you run this command netstat -a -o -n on your command prompt.
Open your command prompt in administrator mode and run this command
net stop winnat
you'll get this response:
The Windows NAT Driver service was stopped successfully.
Them you run this next:
net start winnat
then you will get this response:
The Windows NAT Driver service was started successfully.
once you do that. Start the react server and it would work. Same too if your backend server doesn't run on 3000
It's very simple. You can fix it in 2 easy steps.
Check your environment variables if there is a key/entry with name "PORT".
If found delete that entry or rename it to something else.
It turns out that some other program is using that variable. Usually when you start react-scripts it will look for an environment variable with that title PORT.
Date: Sat 07, October 2020
Windows: Microsoft Windows 10 Pro Build 19041
Node: 12.16.1
NPM: 6.14.8
Something similar was happening to me on my Windows machine. Tried a lot of things suggested here on StackOverflow and other places.
In my case, I was following a video course that was suggesting adding --script-version 1.1.5 (as illustrated below) when creating a new React app.
create-react-app app-name --scripts-version 1.1.5
Here's the package.json scripts versions:
React: 17.0.1
React DOM: 17.0.1
React Scripts: 1.1.5
After running the command npm start and typing y to try to use a different port, the terminal will stay stucked until it was canceled.
Then I created a new React app without --scripts-version 1.1.5 and after trying to running it, it was still running into Something is already running on port 3000 but after typing y, the app will run with no problem on a different port.
Here's the package.json scripts versions (when it was running successfully):
React: 17.0.1
React-Dom: 17.0.1
React-Scripts: 4.0.0
Starting with the reason you do not see anything on localhost:3000, is because there must be a proper webapp or a website/server running on that port, but the port:3000 is currently running some process, just not of a server/site/app.
This out of the way, depending on your type of OS, it is quite easy to check if there is in-fact a process on port:3000 or not. For MacOS, opening a terminal and running sudo lsof -i ':3000' will list the current process on port 3000.
Note that we need to run command as sudo or root
Once you see what process is running, note the PID and run kill -9 {PID}, which should kill the process with PID (i.e distruptive process on port:3000). Now doing a npm start should get your app built, compiled and served on localhost:3000
Mostly what might've happened is that you had a npm start running which you either interrupted, or closed in the foreground. Doing a fg in your terminal will open any background tasks, so if this opens a npm start instance, it was this process stopping your flow. You can then properly end the session making sure all processes on port:3000 are killed.
Happy coding
If you are on linux you can try
pkill -f node
to terminate the processs
The error occurs when a task is left running on the port properly killing it.
this error can occur on both ports. Your react app and your node server.
To solve this you can run the following commands.
netstat -anp tcp | grep 3000
This command in the terminal will give you the list of activities on port 3000
npx kill-port 3000
This command will kill all the running servers on port 3000.
Now if you have the same problem for your Node server. You can follow the same steps.
netstat -anp tcp | grep 5000
Then
npx kill-port 5000
You don't need the first command. it's just to list out the running activities on the port.
just change the port number for any other port number.
This is the output you get after running the commands.
I am using Git bash on windows.
For me, this works every time (macOS): sudo kill -9 $(sudo lsof -t -i:3000)
Simple and Easy solution
close your current terminal and open a new one.
If you are running it in VS Code just create a new terminal and delete the old one.
On React - you can run an already created React single-page application (SPA) by
npm start command.
That may start your locally hosting development server and runs your app at:
http://localhost:3000/ which is equivalent to: 127.0.0.1:3000 address
127.0.0.1 is the default localhost IP number while the default port number set by
create-react-app package is 3000.
When getting: “Something is already running on port 3000" failure error message you may think that the port captured by another process running on your machine but you’ll find that it is captured permanently as if it runs on 0.0.0.0:3000 address
Solution:
In your project libraries created by create-react-app script navigate to:
node_modules/react-scripts/scripts/start.js
While running npm start command - the start.js script is being called and executed
There at start.js file in you editor find the above line:
const HOST = process.env.HOST || '0.0.0.0';
and change it to:
const HOST = process.env.HOST || '127.0.0.1';
save and run your web app again at: http://localhost:3000/ or http://127.0.0.1:3000
I've been working on a project using React.js
It used to work fine on localhost:3000 but suddenly this has stopped working.
The commands I did before was
sudo npm run bundle
sudo npm start
And then my project was running. But now it says localhost refused connection. Message in the console:
"Failed to load resource: net::ERR_CONNECTION_REFUSED". Any ideas why?
I have checked that localhost:3000 not occupied
I have checked that Im working in the correct folder and all files seems * to be present
I have checked that Im using the latest npm and node version
You don't say what OS you are using but if it is MacOS or Linux you might want to check what $HOST is set to.
See How to start a react app with a custom host and port
I am trying to setup a node.js app inside docker, using as host the google compute engine VM gci-stable-55-8872-71-0 (debian), from image project google-containers:
$ gcloud compute instances create myvm --image-project google-containers --image gci-stable-55-8872-71-0 --zone europe-west1-b --machine-type f1-micro --scopes compute-rw
then I try to get a docker container running:
$ sudo docker build -t forperfuse/test .
but I keep getting errors when installing node:
The command '/bin/sh -c npm install' returned a non-zero code: 1
all other dependencies install well but node and npm are not installing- I have tried several options but still cannot get it to work, can you please help? many thanks in advance...
I'm not sure about what is going on, looks like the run command in the dockerfile is aiming to a bash that has a weird header. If you can publish them we can try or...
You can use the bitnami docker image available in launcher for free and works like a charm.
https://console.cloud.google.com/launcher
And there search for the node.js image.