Disable create-react-app webpack hot/live reload at runtime

I'm trying to do some before/after comparisons of my React code in two different tabs/windows, but the hot/live reload feature of create-react-app/webpack is preventing me from running old/new code side-by-side.

The previously accepted solution of using DevTools request blocking the websocket connection with localhost:3000/sockjs-node/* no longer seems to work (on Chrome 86).

1 answer

  • answered 2020-10-16 04:41 LongZheng

    I figured out that the hot/live reload feature calls a global function called webpackHotUpdate which I could override to disable the functionality.

    Run in DevTools console

    window.webpackHotUpdate = () => {}
    

    Note: this does not disable the display of compile errors/warnings which gets sent through the websocket connection.