HMR loading indicator
See original GitHub issueWhat problem does this feature solve?
Unless I’m monitoring the terminal, I often find myself wondering wether my latest changes have gone to the browser yet. Since you’re now showing error messages in the browser view, I think it’d be nice to take the opportunity to also add an indicator which shows you when the HMR process is done.
What does the proposed API look like?
I see two alternatives:
If it’s possible to send a message to the browser before compilation starts, you could display a “Reloading module…” message, which disappears when the process is done.
If the browser only recieves notice after compilation is done, you could display a “Module reloaded” message, which immediately starts fading away. I’ve already made a component like this myself actually, using the module.hot.addStatusHander
hook.
Issue Analytics
- State:
- Created 6 years ago
- Reactions:2
- Comments:5 (3 by maintainers)
Top Results From Across the Web
Hot Module Replacement - webpack
Hot Module Replacement (or HMR) is one of the most useful features offered by ... Hot loading stylesheets can be done by importing...
Read more >How to configure Hot Module Replacement (HMR) with ...
This command will start the WDS server, build your assets and wait for connections from the browser. Now when you visit your website,...
Read more >webpack-dev-server with hot reload reloading entire page ...
I have hot reloading without any problems, but it reloads the entire page whenever I make a single css change. I would like...
Read more >mok-loading-indicator - CodeSandbox
mok-loading-indicator. 0. Embed Fork Create Sandbox Sign in. Sandbox Info. mok-loading-indicator. 0. 170. 0. jvila_llUI Component System.
Read more >Loading Plugin - Quasar Framework
A Quasar plugin which can display a loading state for your app through an overlay with a spinner and a message.
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I’m not a webpack guru by any means, but when perusing the DevServer documentation I figured out that you can go to http://localhost:8080/webpack-dev-server/ which has a little hot loader bar at the top that shows the HMR status
@LinusBorg I might try that out 🙂 Hmm, do you have any pointers on how to get a cli plugin to inject code into the client? Most existing plugins just add files and webpack configs.