Caching issue with webpack-dev-server

Question

I'm having some issues when running the webpack-dev-server. Whenever I save a file, and changes are compiled, they are not being reflected in the browser. (No errors in command line)

I'm running the following command:

webpack-dev-server --progress --color

However, if I run webpack every time I have a change, this is reflected in my browser.

I run Chrome on my Mac (latest v. of OSX), and I've enabled the "Disable cache while devtools is open" option. Needless to say, but hey - you never know, I have my DevTools open.. :)

Am I missing a simple step here?

Answer 1

To disable cache, I used Cache-Control header in webpack config.

devServer: {
  headers: {
    'Cache-Control': 'no-store',
  },
},

Answer 2

I had the same problem and I was using dist/app.js file in my html and not app.js that generated by webpack-dev-server.

Using this in my html solved the issue:

<script src="vendor.js"></script>
<script src="app.js"></script>