获取 Websocket 错误但未在代码中使用 Websocket

Posted 2023-02-16

【中文标题】获取 Websocket 错误但未在代码中使用 Websocket

【英文标题】：Getting Websocket Error But Not Using Websockets in Code

【发布时间】：2021-10-22 18:23:16

【问题描述】：

我在运行 npm run dev 时不断收到此 websocket 错误。我在一组 WSL 和 Mac 用户中工作，我们的 repo 都适用于他们，但我是唯一在尝试运行我们的应用程序时遇到此问题的人。不知道为什么会发生这种情况。

Websocket Error when running npm run dev

这是我们的 webpack 配置文件。

var path = require("path");
var htmlWebPackPlugin = require("html-webpack-plugin");

module.exports = 
    entry: "./src/index.js",
    output: 
        path: path.join(__dirname, "build"),
        publicPath: '/build',
        filename: "index_bundle.js"
    ,
    mode: process.env.NODE_ENV,
    module: 
        rules: [
          
            test: /\.tsx?/,
            use: 'ts-loader',
            exclude: /node_modules/,
          ,
          
            test: /\.jsx?/,
            use: 
              loader: 'babel-loader',
              options: 
                presets: ['@babel/preset-env', '@babel/preset-react'],
                plugins: ["@babel/plugin-syntax-jsx"]
              ,
            ,
            exclude: /npm_modules/
          ,
          
            //npm install -D sass-loader css-loader style-loader webpack
            // /\.s[ac]ss$/i
            // /\.css /
            test: /\.s?css/,
            use: ["style-loader", "css-loader", "sass-loader"
            ],
          ,
          
            // Now we apply rule for images
            test: /\.(png|jpg|gif|svg)$/,
            use: [
              
                // Using file-loader for these files
                loader: "file-loader",
                // loader: "url-loader",
                // In options we can set different things like format
                // and directory to save
                options: 
                  outputPath: '/images'
                
              
            ]
          ,
          // 
          //   test: /\.(png|jpg)$/,
          //   loader: 'url-loader'
          // ,
        ]
    ,
    resolve: 
        // Enable importing JS / JSX files without specifying their extension
        extensions: [".js", ".jsx", ".tsx", ".ts"],
    ,
    devServer: 
      static: 
        directory: path.join(__dirname, '/src'),
        ,
      proxy: 
        '/': 'http://localhost:3000'
      ,
      compress: true,
      port: 8080,
  ,
;

【问题讨论】：

如果它适用于其他所有人然后你，它可能不是代码，而是你的环境。询问其他人正在使用什么节点版本，也许您需要将您的节点和npm升级到更新的版本。

【参考方案1】：

找到答案/可行的解决方案。我将 devServer 中的端口从 8080 更改为 9000 并且它起作用了，我不确定为什么会起作用，但它确实起作用了。我还在 snowpack.dev 文档中发现这是一个推荐的解决方案，它说要做同样的事情。 https://www.snowpack.dev/reference/common-error-details