Keep getting [WDS] Disconnected! error

问题:

I'm currently getting started on ReactJs. However, I've come across the following error in the console which doers not show in the terminal:

[WDS] Disconnected!sock.onclose @ client?64c0:70EventTarget.dispatchEvent @ eventtarget.js:49(anonymous function) @ main.js:356

abstract-xhr.js:128 GET http://127.0.0.0/sockjs-node/info?t=1461853324372 net::ERR_CONNECTION_TIMED_OUT

It's looking for "sockjs-node" which I've installed locally and globally, however no change. Shouldn't it be searching the "node_modules" folder?

Here is my configuration:

var webpack = require("webpack"); var path = require("path");   module.exports = {      devtool: "inline-source-map",     entry: [         "webpack-dev-server/client?http://127.0.0.0/",         "webpack/hot/only-dev-server",         "./src"     ],     devServer: {         contentBase: "./public",         hot: true,             inline: true,         quiet: false,         noInfo: true,         stats: { colors: true }     },     output: {         path: path.join(__dirname, "./public"),         filename: "./assets/js/bundle.js"     },     resolve: {         modulesDirectrories: ["node_modules", "src"],         extentions: ["", ".js"]     },     module : {         loaders: [             {                  test: /\.jsx?$/,                 exclude: "/node_modules/",                 loaders: ["react-hot-loader", "babel?presets[]=react,presets[]=es2015"]              },              {                 test: /\.css$/,                 loader: "style-loader!css-loader"             },              {                 test: /\.gif$/,                 loader: "url-loader?mimetype=image/png"             },              {                 test: /\.woff(2)?(\?v=[0-9].[0-9].[0-9])?$/,                 loader: "url-loader?mimetype=application/font-woff"             },              {                 test: /\.(ttf|eot|svg)(\?v=[0-9].[0-9].[0-9])?$/,                 loader: "file-loader?name=[name].[ext]"             }         ]     },     plugins: [          new webpack.HotModuleReplacementPlugin(),         new webpack.NoErrorsPlugin(),         new webpack.DefinePlugin({             "process.env": {                 NODE_ENV: JSON.stringify("development")             }         })     ]  } 

Any help is appreciated, and thanks in advance.

回答1:

I fixed it like this;

as-is :

  entry: [     "webpack-dev-server/client?http://localhost:9090",     "webpack/hot/only-dev-server",     "./src/app"   ], 

to-be :

  entry: [     "webpack-dev-server/client?http://127.0.0.0:8080",     "webpack/hot/only-dev-server",     "./src"   ], 

回答2:

The problem seems to be that you have not included the port number in url webpack-dev-server/client?http://127.0.0.0/

Change This

entry: [     "webpack-dev-server/client?http://127.0.0.0/",     "webpack/hot/only-dev-server",     "./src" ], 

To:

entry: [     "webpack-dev-server/client?http://127.0.0.0:8080/",     "webpack/hot/only-dev-server",     "./src" ], 

回答3:

You don't need to change webpack.config.js

Try fixing in package.json (start server on port 3000 instead of standard 8080):

"start": "./node_modules/.bin/webpack-dev-server --host localhost --port 3000 --content-base src --inline --hot", 

回答4:

In development.js file try to use the following settings for dev_server:

dev_server: {     host: '127.0.0.0'     port: 8080     https: false     disableHostCheck: true } 

回答5:

in index.htm change path:

to

文章来源: Keep getting [WDS] Disconnected! error