javascript - [WDS] 不断断开!错误,ReactJs,Webpack

标签 javascript reactjs webpack webpack-dev-server

enter image description here

此问题与帖子相关:Keep getting [WDS] Disconnected! error

我已经根据答案更新了我的 webpack 配置设置,但是控制台中仍然出现“[WDS] Disconnected!错误”。

请问有什么建议吗?

webpack.config.js

var webpack = require("webpack");
var path = require("path");


module.exports = {

devtool: "inline-source-map",
entry: [
    "webpack-dev-server/client?http://127.0.0.0:8080/",
    "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")
        }
    })
]}

最佳答案

将 TransportMode 更改为 ws 而不是“sock-js.node”:-

devServer: {
        transportMode: 'ws', 
        injectClient: false,
      }

关于javascript - [WDS] 不断断开!错误,ReactJs,Webpack,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39291796/

相关文章:

javascript - 使用 Angular 拦截未经授权的 API 调用

javascript - webpack 和 kafka-node 集成

reactjs - 模块解析失败?我需要帮助设置 Babel

javascript - 文件上传缺少路径属性

javascript - 我可以通过 TSLint 或 tsconfig 阻止 IDE 自动包装属性吗?

javascript - 使用适当的样式和语法突出显示格式化 CKEditor 文本

reactjs - 在 React Native 中,如何使用浅层渲染测试我的组件?

reactjs - Webpack 开发服务器刷新循环疯狂

javascript - 如何将 React 置于生产模式?

javascript - 使用 webpack 的 Angular 1.6.4 组件单元测试找不到 DirectiveProvider