web-dev-qa-db-fra.com

Continuez à vous déconnecter de [WDS]! Erreur

 enter image description here

Je commence actuellement à utiliser ReactJs. Cependant, j'ai rencontré l'erreur suivante dans la console qui ne s'affiche pas dans le terminal:

[WDS] Déconnecté! Sock.onclose @ client? 64c0: 70EventTarget.dispatchEvent @ eventtarget.js: 49 (fonction anonyme) @ main.js: 356

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

Il cherche "sockjs-node" que j'ai installé localement et globalement, mais aucun changement. Ne devrait-il pas chercher dans le dossier "node_modules"?

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

}

Toute aide est appréciée et merci d'avance.

javascriptnode.jsreactjs
24
meji

Je l'ai réparé comme ça;

comme si : 

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

être :

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

Le problème semble être que vous n'avez pas inclus le numéro de port dans l'URL webpack-dev-server/client?http://127.0.0.0/

Change ça 

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

À:

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

Pour moi, résolu quand j'ai créé un fichier: vue.config.js dans le projet racine avec le contenu ci-dessous:

module.exports = {
  devServer: {
    disableHostCheck: true
  }
}
3
Arlei F. Farnetani Junior

Dans notre cas, le problème était dû à une incompatibilité entre le nom d'hôte utilisé par webpack-dev-server pour servir l'actif et le nom d'hôte à partir duquel l'application était exécutée.

En particulier, notre application locale s’exécutait à partir de https://dev.resumize.me , mais webpack-dev-server servait l’actif à partir de 127.0.0.1.

Vous pouvez contrôler le nom d'hôte utilisé par webpack-dev-server avec l'option --Host. Donc dans notre cas, nous avons dû le lancer avec:

webpack-dev-server.js --Host dev.resumize.me --https 

J'espère que cela t'aides.

0
Black Shell

Vous n'avez pas besoin de changer webpack.config.js 

Essayez de corriger dans package.json (démarrer server sur le port 3000 au lieu de standard 8080): 

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

Dans le fichier development.js, essayez d’utiliser les paramètres suivants pour dev_server:

dev_server: {
    Host: '127.0.0.0'
    port: 8080
    https: false
    disableHostCheck: true
}
0
k1r8r0wn

J'utilise angular et j'utilise le serveur webpack en tant que dépendance de dev. Je cherchais une réponse et je ne pouvais pas en trouver une qui me convienne. 

Remarque: il ne s'agit que d'une solution de contournement et non d'une solution au problème actuel

ouvrir le fichier suivant

YOUR_PROJECT_ROOT\node_modules\webpack-dev-server\client\index.js

dans la méthode onSocketMsg , sous la fonction ok () commente la ligne reloadApp ().  

Cela empêche l'application de recharger en continu. Cela empêche l'application de recharger même si vous apportez vos modifications. Mais vous pouvez toujours recharger votre navigateur manuellement et vos modifications seront reflétées. 

0
Rahul kalivaradarajalu