Hot Module Reload Broken in Webpack Dev Server
After Cursor modified your webpack or dev server configuration, hot module reload (HMR) no longer works. Changes require full page refresh to see updates, slowing down development.
HMR configuration or webpack middleware was broken.
Error Messages You Might See
Common Causes
- HMR not enabled in webpack config
- Dev server host/port changed but client not updated
- Hot middleware not installed or configured
- File watchOptions settings prevent detection
- Entry point changed, breaking HMR injection
How to Fix It
Enable HMR in dev config: devServer: {hot: true}. Install webpack-dev-middleware. Verify host/port match. Check webpack-dev-server version. Ensure files are being watched: watchOptions: {poll: 1000} if needed.
Real developers can help you.
You don't need to be technical. Just describe what's wrong and a verified developer will handle the rest.
Get HelpFrequently Asked Questions
How do I enable HMR?
Add devServer: {hot: true} to webpack config. For Next.js it's automatic. For others use webpack-hot-middleware.
Why doesn't my component update with HMR?
Styles HMR automatically. Components need acceptance: module.hot.accept(). Or use React-Refresh.