webpack-dev-server can't find localhost - npm

Question

I'm trying to get started with React using webpack, but keep running into an error when I try to set up webpack-dev-server. I ran
npm install webpack-dev-server
followed by
webpack-dev-server
and the command line returns the following:
events.js:154
throw er; // Unhandled 'error' event
^
Error: getaddrinfo ENOTFOUND localhost
at errnoException (dns.js:26:10)
at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:77:26)
Any clues on what is happening here?
I don't really know how webpack works to try and search for the root of the problem, but I've also been developing a website using PHP at port 80 with MAMP, I don't know if this is maybe part of the issue?

Answer 1

Solved, turned out my hosts file (found under /etc/hosts on a mac) had one line missing and so webpack couldn't find localhost. I restored it to its default following these instructions and it now works!

Answer 2

Make sure your /etc/hosts file includes localhost.
Open /etc/hosts
$ sudo vi /etc/hosts
Copy and paste this, if it's missing:
127.0.0.1 localhost
255.255.255.255 broadcasthost
::1 localhost
fe80::1%lo0 localhost

Answer 3

Did not work for me even after restoring the hosts file and trying with a different port. The way I made it to work was to give a custom host (127.0.0.1) and port (3001 or any other available) when starting the server:
webpack-dev-server --host 127.0.0.1 --port 3001

Answer 4

The most common reason for that error is that you have something else already using that port. Try starting it on another port.
webpack-dev-server --port 3001

Answer 5

Also check if /etc/hosts have 127.0.0.1 pointing to localhost as well.

Answer 6

Also encountered the same error and nothing fixed it.
It appears, in my case, that I accidentally "corrupted" the /etc/hosts file by been able to write to it without the sudo permission.
The clue was when I cat /etc/hosts the output was one messy line. I deleted and re-created the file as sudo, with the #lizzie-cd link and all went back to normal

Answer 7

In latest mac and linux os , the webpack dev server wokinnly only on adding the
host: "127.0.0.1"
inside the devServer in the webpack.config

Answer 8

Hosts file was fine. Going into web/dev.js and updating the file to the following fixed this issue for me. Still not sure why.
const webpack = require('webpack');
const merge = require('webpack-merge');
const path = require('path');
const { buildConfig, APP_PATH, WEB_PATH } = require('./common');
module.exports = (env, argv) => (
merge(buildConfig(env, argv), {
entry: path.join(WEB_PATH, 'index.hmr.js'),
devtool: 'inline-source-map',
plugins: [
new webpack.HotModuleReplacementPlugin(),
],
devServer: {
contentBase: APP_PATH,
openPage: '',
inline: true,
stats: 'minimal',
open: true,
port: 3001,
hot: true,
host: "127.0.0.1"
},
})
);

Answer 9

Very strange. I had explicitly add the dev server port to my hosts file. E.g.
127.0.0.1 localhost:8001
Then npm run dev works again.
If that still does not work for you you could try removing node_modules completely and re-installing fresh.
rm -rf node_modules/
npm install # Or `yarn`