Stack Overflow
Stack Overflow

Questions tagged [hot-module-replacement]

hot module replacement means code changes appear instantly in the browser without the need to rebuild the entire app.

Intro

“Hot Module Replacement” (HMR) is a feature to inject updated modules into the active runtime.

It’s like LiveReload for every module.

HMR is “opt-in”, so you need to put some code at chosen points of your application. The dependencies are handled by the module system. HMR is popularly used by webpack.

Questions

  • Usage of HMR and code implementation.
  • Trouble in implementing the concept in your code.
  • Trouble using it with webpack or other bundlers.
  • Unexpected behavior while using HMR.
  • Basically, any HMR related questions!

Useful links

197 questions
3
votes
1 answer

webpack-dev-server: how to preserve state with module.hot.data?

I'm using webpack-dev-server's Hot Module Replacement (HMR). In the code, I have this: // index.js // ... window.enableFoo = false; // can set this to 'true' in DevTools console if (module && module.hot) { module.hot.accept((err) => { …
Leedehai
  • 3,660
  • 3
  • 21
  • 44
3
votes
0 answers

Webpack ts-loader ignores type changes with hot module replacement

I have a simple webpack configuration with: ts-loader and hot module replacement. When I make a type change I get an TS2322 error, and when I fixed it ( and all files from IDE are marked as "error-free" ) I still get the error from above. If I…
que1326
  • 2,227
  • 4
  • 41
  • 58
3
votes
2 answers

How to fix delay browser reload in webpack dev server with express

I am trying to setup webpack dev server using webpackDevMiddleware, webpackHotMiddleware with express generator and react. I got everything working, but there's a huge delay in the reload. I will get this message every time in the browser 'GET…
spaceDog
  • 441
  • 1
  • 7
  • 22
3
votes
1 answer

Webpack-dev-server does not rebuild bundle

Very strange moment. I have: webpack.hmr.config.js // webpack.hmr.config.js const webpack = require('webpack'); const HtmlWebpackPlugin = require('html-webpack-plugin'); const WebpackChunkHash = require('webpack-chunk-hash'); const…
Alexander Dozmorov
  • 161
  • 1
  • 3
  • 13
3
votes
1 answer

How does Webpack HMR interact with Vuex modules?

I'm using Webpack, it's Hot Module Replacement (HMR) feature and Vuex in Vue.js app. The load sequence is as follows: User clicks shared link from a message - launch loading UI and hit an API for some content Content returns - initialize a Vuex…
Peza
  • 1,347
  • 1
  • 11
  • 23
3
votes
2 answers

Angular 4, Hot module replacement appending instead of replacing

I'm having a weird issue, Hot module replacement has been working fine in my app for a while, but at some point recently, it has changed. Instead of replacing the specific component on the page, it is appending the component to the top of the page…
Chris Kooken
  • 32,730
  • 15
  • 85
  • 123
3
votes
0 answers

webpack-dev-middleware with HMR behind reverse proxy in IIS

I'm trying to setup webpack with Hot Module Replacement and reaching it through a reverse proxy in IIS using the Rewrite module My simple rewrite rule: …
Cotten
  • 8,787
  • 17
  • 61
  • 98
3
votes
0 answers

Use webpack-dev-server with multiple entries and HMR

I have 3 entries in my webpack.config.js that generate 3 different HTML files. I do this so I can host them on separate domains: index.html = http://app.local site.html = http://site.local forms.html = http://forms.local Right now I have a…
sontek
  • 12,111
  • 12
  • 49
  • 61
3
votes
1 answer

Webpack-dev-server — HMR Not receive update signal from WDS

HMR Not receive update signal from WDS Operating System: MacOS 10.12.6 Node Version: 8.5.0 NPM Version: 5.3.0 webpack Version: 3.6.0 webpack-dev-server Version: 2.8.2 Code // webpack.config.js const path = require('path') const HtmlWebpackPlugin…
Arkadiy Zamaraev
  • 133
  • 2
  • 7
3
votes
1 answer

node.js: delete require.cache not working

I'm trying to build a HMR for koa2 development with chokidar. Changing text in ./middlewares/render triggers chokidar file-watch event, and require.cache cleared immediately as expected, but when I reload page, the text rendered actually not…
Kim
  • 5,045
  • 6
  • 38
  • 60
3
votes
0 answers

Webpack Hot Module Replacement for KnockoutJS

I'm trying to get HMR to work for my knockout application and currently struggling to get HMR to reload whenever I change something inside the viewModel itself, but anything outside the scope will…
Ali
  • 9,997
  • 20
  • 70
  • 105
3
votes
2 answers

Can't get Webpack 2 HMR React to work

Currently I'm struggling to get HMR working in my Webpack 2 setup. I'll explain my entire setup so I hope this is enough for someone to understand what's happening. The structure of my project: config dev.js prod.js dist css js …
DavidWorldpeace
  • 519
  • 2
  • 7
  • 22
3
votes
2 answers

Webpack - [HMR] Hot Module Replacement is disabled

I've looked around, but can't get any of the answers I've seen on stackoverflow to work. I cannot use the command line for webpack or the webpack dev-server; I am restricted to using the Node API. Below is how I am using…
coolpic.jpg.exe
  • 31
  • 1
  • 2
3
votes
1 answer

Webpack Dev Server with React Hot Loader

I have a webpack configuration that works perfect in itself. I'm trying to install React Hot Loader together with HMR as suggested, which require webpack-dev-server. Here I cannot get it to work. I can not find where my bundle is located. I want it…
Emo
  • 580
  • 1
  • 8
  • 27
2
votes
1 answer

How do I correctly configure Neutralinojs to work with Vite HMR?

I'm trying to integrate Neutralinojs with Vite to improve my dev workflow and use HMR. How should I configure the setup for HMR to function properly? I've tried both in macOS and Windows without luck. I’ve followed the Neutralinojs docs. I've…
Jouni Kantola
  • 1,097
  • 7
  • 12
1 2 3
…
13 14