Question

所以目前我正在开发一个.NET MVC应用程序，其中应用程序的一部分是一个门户，其中客户端完全使用reactjs呈现。

基本上我的门户网站有一个index.cshtml文件，如下所示：

<html lang="en">
<head>
    <title>User Portal</title>
</head>

<body>
    <div id="app"></div>
    <script src="http://localhost:3000/bundle.js"></script>
</body>
</html>

我的客户端reactjs应用程序使用快速服务器在端口：3000上运行。我通过localhost：53079访问我的主MVC应用程序。我想知道是否有可能让热模块重新加载到端口53079，因为这是我访问我的应用程序的方式？

我的webpack.config.dev.js如下所示：

export default {
  debug: true,
  devtool: 'inline-source-map',
  noInfo: false,
  entry: [
    'eventsource-polyfill', // necessary for hot reloading with IE
    'webpack-hot-middleware/client?reload=true', //note that it reloads the page if hot module reloading fails.
    path.resolve(__dirname, 'src/index')
  ],
  target: 'web',
  output: {
    path: __dirname + '/dist', // Note: Physical files are only output by the production build task `npm run build`.
    publicPath: 'http://localhost:3000/',
    filename: 'bundle.js'
  },
  devServer: {
    contentBase: path.resolve(__dirname, 'src')
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NoErrorsPlugin()
  ],
  module: {
    //.....
  }
};

我已尝试修改devServer中的端口号，以及输出路径中没有任何运气。我也能找到关于如何配置hmr端口号的非常简单的阅读。目前我的控制台被以下错误消息所困扰：

EventSource的响应具有MIME类型（＆＃34; text / html＆＃34;），而不是＆＃34; text / event-stream＆＃34;。中止连接。

Answer 1

我想通了，你需要设置选项以指向你的hmr端点。

app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions {
          HotModuleReplacement = true,
          HotModuleReplacementEndpoint = "/dist/__webpack_hmr"
        });

无法让热模块更换在不同的端口上运行

1 个答案: