Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

WebPack devServer - localhost refused to connect

I have configured WebPack for my application and added webpack-dev-server. It compiles successfully after running and gives me "Project is running at http://localhost:9000/". However, when I try to open it in my browser I get a "This site can't be reached" page with the following error:

ERR_CONNECTION_REFUSED

Any fix suggestions will be greatly appreciated!

Snippets from my package.json file:

"scripts": {
    "build": "webpack --config webpack.config.js",
    "start:dev": "webpack-dev-server"
"devDependencies": {
    "webpack": "^4.29.6",
    "webpack-cli": "^3.3.0",
    "webpack-dev-server": "^3.2.1",

Snippet from my webpack.config.js file:

devServer: {
    contentBase: path.join(__dirname, 'dist'),
    compress: true,
    port: 9000
  }
like image 532
mowie Avatar asked Mar 29 '19 23:03

mowie


People also ask

What is devServer?

devServer.clientAllows to set log level in the browser, e.g. before reloading, before an error or when Hot Module Replacement is enabled. webpack.config.js module.

How does Webpack devServer work?

When you run webpack dev server what webpack dev server does is, instead of creating a bundled file ( e.g. bundle. js ) in dist folder, it creates a bundled file in memory. It then serves that information to express , and then express creates a web socket connection to render that on the browser on a certain port no.

What port does webpack use?

Either method will start a server instance and begin listening for connections from localhost on port 8080 . webpack-dev-server is configured by default to support live-reload of files as you edit your assets while the server is running. See the documentation for more use cases and options.


1 Answers

For those who might have the same issue, I seem to have found a solution shortly after posting this question. Here it is: link.

like image 199
mowie Avatar answered Oct 08 '22 03:10

mowie