Need help; __webpack_hmr is serving the SPA app #514

New Issue

fergalmoran · 2025-08-09T17:16:35Z

fergalmoran commented

2025-08-09 17:16:35 +00:00

Originally created by @ghost on 8/11/2017

I'm getting this error:

EventSource's response has a MIME type ("text/html") that is not "text/event-stream". Aborting the connection.

The problem seems to be because __webpack_hmr is serving the SPA app instead of the EventSource, but I'm not sure how to fix this.

My Startup file looks like this:

            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
                if (context.Configuration.EnableDevelopmentWebInterface) {
                    app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions
                    {
                        HotModuleReplacement = true,
                        ProjectPath = ClientAppPath,
                        ConfigFile = $"{ClientAppPath}build/webpack.dev.conf.js"
                    });
                }
            }
            else
            {
                app.UseExceptionHandler("/Home/Error");
            }

            // add wwwroot/
            app.UseStaticFiles();

            // set up Nancy OWIN hosting
            app.UseOwin(x => x.UseNancy(options =>
            {
                options.PassThroughWhenStatusCodesAre(
                    HttpStatusCode.NotFound,
                    HttpStatusCode.InternalServerError
                );
                options.Bootstrapper = new SpeercsBootstrapper(context);
            }));

            // set up MVC fallback
            app.UseMvc(routes =>
            {
                routes.MapRoute(
                    name: "default",
                    template: "{controller=Home}/{action=Index}/{id?}");

                routes.MapSpaFallbackRoute(
                    name: "spa-fallback",
                    defaults: new { controller = "Home", action = "Index" });
            });

and my Webpack config:

module.exports = {
  entry: {
    app: './src/main.js'
  },
  output: {
    path: config.build.assetsRoot,
    filename: '[name].js',
    publicPath: process.env.NODE_ENV === 'production'
      ? config.build.assetsPublicPath
      : config.dev.assetsPublicPath
  },
  resolve: {
    extensions: ['.js', '.vue', '.json'],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      '@': resolve('src')
    }
  },
  module: {
    rules: [
      {
        test: /\.(js|vue)$/,
        loader: 'eslint-loader',
        enforce: 'pre',
        include: [resolve('src'), resolve('test')],
        options: {
          formatter: require('eslint-friendly-formatter')
        }
      },
      {
        test: /\.vue$/,
        loader: 'vue-loader',
        options: vueLoaderConfig
      },
      {
        test: /\.js$/,
        loader: 'babel-loader',
        include: [resolve('src'), resolve('test')]
      },
      {
        test: /\.styl$/,
        loader: ['style-loader', 'css-loader', 'stylus-loader']
      },
      {
        test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
        loader: 'url-loader',
        options: {
          limit: 10000,
          name: utils.assetsPath('img/[name].[hash:7].[ext]')
        }
      },
      {
        test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
        loader: 'url-loader',
        options: {
          limit: 10000,
          name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
        }
      }
    ]
  }
}

*Originally created by @ghost on 8/11/2017* I'm getting this error: `EventSource's response has a MIME type ("text/html") that is not "text/event-stream". Aborting the connection.` The problem seems to be because` __webpack_hmr` is serving the SPA app instead of the EventSource, but I'm not sure how to fix this. My Startup file looks like this: ```csharp if (env.IsDevelopment()) { app.UseDeveloperExceptionPage(); if (context.Configuration.EnableDevelopmentWebInterface) { app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions { HotModuleReplacement = true, ProjectPath = ClientAppPath, ConfigFile = $"{ClientAppPath}build/webpack.dev.conf.js" }); } } else { app.UseExceptionHandler("/Home/Error"); } // add wwwroot/ app.UseStaticFiles(); // set up Nancy OWIN hosting app.UseOwin(x => x.UseNancy(options => { options.PassThroughWhenStatusCodesAre( HttpStatusCode.NotFound, HttpStatusCode.InternalServerError ); options.Bootstrapper = new SpeercsBootstrapper(context); })); // set up MVC fallback app.UseMvc(routes => { routes.MapRoute( name: "default", template: "{controller=Home}/{action=Index}/{id?}"); routes.MapSpaFallbackRoute( name: "spa-fallback", defaults: new { controller = "Home", action = "Index" }); }); ``` and my Webpack config: ```js module.exports = { entry: { app: './src/main.js' }, output: { path: config.build.assetsRoot, filename: '[name].js', publicPath: process.env.NODE_ENV === 'production' ? config.build.assetsPublicPath : config.dev.assetsPublicPath }, resolve: { extensions: ['.js', '.vue', '.json'], alias: { 'vue$': 'vue/dist/vue.esm.js', '@': resolve('src') } }, module: { rules: [ { test: /\.(js|vue)$/, loader: 'eslint-loader', enforce: 'pre', include: [resolve('src'), resolve('test')], options: { formatter: require('eslint-friendly-formatter') } }, { test: /\.vue$/, loader: 'vue-loader', options: vueLoaderConfig }, { test: /\.js$/, loader: 'babel-loader', include: [resolve('src'), resolve('test')] }, { test: /\.styl$/, loader: ['style-loader', 'css-loader', 'stylus-loader'] }, { test: /\.(png|jpe?g|gif|svg)(\?.*)?$/, loader: 'url-loader', options: { limit: 10000, name: utils.assetsPath('img/[name].[hash:7].[ext]') } }, { test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/, loader: 'url-loader', options: { limit: 10000, name: utils.assetsPath('fonts/[name].[hash:7].[ext]') } } ] } } ```

fergalmoran closed this issue

2025-08-09 17:16:35 +00:00

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: github/JavaScriptServices#514