2016-04-28 3 views
13

enter image description hereKeep bekommen [WDS] Disconnected! Fehler

Ich beginne gerade mit ReactJs. Allerdings habe ich über die folgenden Fehler in der Konsole kommen die Täter nicht in das Terminal zeigen:?

[WDS] Disconnected sock.onclose @ Client 64c0: 70EventTarget.dispatchEvent @ eventtarget.js: 49 (anonyme Funktion) @ main.js: 356

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

Es ist für "sockjs-Knoten" auf der Suche, die ich habe lokal und global installiert ist, jedoch Keine Änderung. Sollte es nicht den Ordner "node_modules" durchsuchen?

Hier ist meine Konfiguration:

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") 
      } 
     }) 
    ] 

} 

Jede Hilfe ist willkommen, und danke im voraus.

+1

Ihre App läuft auf Port 8080, aber du bist HMR hört Port 80 Versuchen Sie Folgendes: '" webpack-dev-server/client? Http: //127.0.0.0: 8080/"' – lux

+0

Danke Lux ... jetzt bekommt es das Socket-Modul. Allerdings wird weiterhin "[WDS] Disconnected!" Angezeigt. – meji

+0

Hm, mein Eintrag sieht identisch aus außer ich benutze localhost und nicht die lokale IP: 'entry = [ 'webpack-dev-server/client? Http: // localhost: 8080', 'webpack/hot/only-dev- Server ', './ src/bootstrap ' ] ' – lux

Antwort

2

Das Problem scheint zu sein, dass Sie nicht die Portnummer im URL webpack-dev-server/client?http://127.0.0.0/

ändern Diese

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

zu enthalten haben:

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

ich es wie folgt festgelegt;

wie sie ist:

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

zu sein:

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

Der zu-Teil hat eine andere Portnummer, aber Für mich wurde das Problem gelöst, indem ich localhost durch IP-Adresse ersetzte. –

0

Sie brauchen nicht webpack.config.js

Versuchen Fixierung in package.json (Start Server auf Port 3000 zu ändern anstelle von Standard 8080):

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

Das hat nicht für mich funktioniert. Können Sie erklären, warum es einen Unterschied machen sollte? – aioobe

-1

in index.htm ändern Pfad:

<link rel="stylesheet" href="./main.css"> 
    <script src="./main.js"></script> 

zu

<link rel="stylesheet" href="/main.css"> 
    <script src="/main.js"></script> 
0

In development.js Datei versuchen Sie die folgenden Einstellungen für dev_server zu verwenden:

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