title: Browser loads old bundle.js from Webpack
body: <p>I'm a React newbie attempting to learn how to integrate a Flask app with React. I'm finding that whenever I make changes to my React <code>.js</code> files, the changes are being recompiled in my <code>bundle.js</code> but not appear in my browser.</p>
  
  <p>To replicate, clone the source code from <a href="https://github.com/bonniee/react-flask" rel="noreferrer">this Github repo</a>. Follow the instructions to set up, and make sure to run <code>webpack --watch</code> and <code>python app.py</code> from a virtual environment. It should start up a simple web server accessible at <code>localhost:5000</code>.</p>
  
  <p>You should get this screen when visiting on Chrome:
  <a href="https://i.stack.imgur.com/IW1Qo.png" rel="noreferrer"><img src="https://i.stack.imgur.com/IW1Qo.png" alt="enter image description here"></a></p>
  
  <p>Next, go into your <code>Hello.js</code> file and make some random edits- for example, change <code>Hello World!</code> to <code>Hello everyone!</code>. From what I've learned, <code>webpack --watch</code> should take care of listening to changes and recompiling, which it does: if you go into <code>bundle.js</code> you'll see that the changes have been recompiled:</p>
  
  <pre><code>var Hello = _react2.default.createClass({
    displayName: 'Hello',
    render: function render() {
      return _react2.default.createElement(
        'h1',
        null,
        'Hello, everyone!'
      );
    }
  });
  </code></pre>
  
  <p>However, when you refresh your browser, you'll get the same exact message (Hello World) as before. When I inspect the source <code>bundle.js</code> that Chrome is using, I find that it is STILL using my old code:<a href="https://i.stack.imgur.com/9Onzn.png" rel="noreferrer"><img src="https://i.stack.imgur.com/9Onzn.png" alt="enter image description here"></a>.</p>
  
  <p>My theory is that Chrome is using some sort of caching? But I have been playing around with this for about an hour and am unable to get my <code>bundle.js</code> to update.</p>
  
  <p>What is causing my browser to load my <code>bundle.js</code> file?</p>
  
  <p><strong>Edit:</strong> I reloaded, and now the change has been applied to my browser screen. However, it seems like an exceptionally long time to refresh and update- at least 4-5 minutes. Any way to shorten this time frame?</p>