Webpack的WebSocket shim错误

Question

我在webpack项目上创建WebSocket对象时遇到了麻烦。当我调用new WebSocket("")时，看起来好像我得到了构造函数而不是该构造函数的新对象。我有一个简单的网页，不使用webpack，一切正常。使用Chrome调试器逐步完成工作版本如下所示：

我无法进入WebSocket构造函数，它只是跳转到下一行。现在使用我的webpacked应用程序，它会进入我看到的构造函数：

走出去的时候我看到了：

我真的不确定我在这里做错了什么，我该如何解决这个问题？该应用程序不是由webpack服务器托管，我只使用webpack进行打包。所有这些都在OSX上的Chrome上;下面是我的webpack.config.js

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

module.exports = {
  devtool: 'eval',
  entry: [
//    'webpack-dev-server/client?http://localhost:3000',
//    'webpack/hot/only-dev-server',
    './src/turborabbit'
  ],
  output: {
    path: path.join(__dirname, 'dist'),
    filename: 'bundle.js',
    publicPath: '/static/'
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin()
  ],
  module: {
    loaders: [{
      test: /\.js$/,
      loaders: ['react-hot', 'babel'],
      include: path.join(__dirname, 'src')
    }]
  }
};

编辑：

我导入并遇到问题的模块是rserve。我有一个解决方法，这是我做过的最丑陋的事情。该模块仅在违规文件中使用下划线和websocket;我已使用imports-loader覆盖了模块的require调用，并通过ProvidePlugin注入了下划线。这是webpack配置的相关部分：

plugins: [
  new webpack.HotModuleReplacementPlugin(),
  new webpack.ProvidePlugin({
    '_': 'underscore'
  })
],
module: {
  loaders: [{
    test: /\.js$/,
    loaders: ['imports', 'react-hot', 'babel'],
    include: path.join(__dirname, 'src')
  }]
}

我按如下方式加载模块：

var Rserve = require ('imports?require=>(function(x){return(x==="ws"?global.WebSocket:_);})!rserve');

我衷心希望有更好的方法

Answer 1

通过在网络包中对ws进行别名并制作一个只返回WebSocket的垫片，我找到了一个更好的解决方案。 webpack.config的相关部分：

resolve: {
  alias: {
    ws: path.resolve ('./') + '/src/shim/ws.js'
  }
}

并在src / shim / ws.js中：

module.exports = WebSocket || MozWebSocket;