18

I have a decent sized webpack application that's heavily organized into particular segments. Everything works great with both pure javascript and jsx files, as anytime I update anything it incrementally rebuilds the bundle.

I have now added a new folder in the same root as all my others, and created a new javascript file in it. Webpack knows too look for it because it is including the code in the bundle, and anytime it sees that one of the other files is changed it correctly rebuilds all changes, including in my new javascript file.

However, for some reason whenever I save a change to this one javascript file, webpack does not detect that it needs to reload the changes from it. Therefore, if the only changes I make are in this one javascript file a new bundle won't be created and I have to ctrl+c and re-run webpack.

I've tried renaming the folder, renaming the javascript file, and several other steps that did nothing to help the situation.

Can anyone give any insight into what may be going on, or is there any way I can get more information about what webpack is seeing or not seeing?

Abhishek
  • 6,912
  • 14
  • 59
  • 85
KallDrexx
  • 27,229
  • 33
  • 143
  • 254
  • It might be a long shot just but take a look at [this](http://stackoverflow.com/questions/26708205/webpack-watch-isnt-compiling-changed-files/41453430#41453430) post: – utxeee Jan 03 '17 at 22:36

4 Answers4

47

using the old watcher plugin seems to resolve the issue for my needs. Done in my configuration via:

plugins: [
    new webpack.OldWatchingPlugin()
],
KallDrexx
  • 27,229
  • 33
  • 143
  • 254
  • This fixed this issue for me which started after updating webpack... odd. – Ray Suelzer May 10 '15 at 17:55
  • This also fixed an issue where imported .scss files would not trigger a compile when using `ExtractTextPlugin`. Thank you! – theLucre Oct 09 '15 at 04:07
  • 1
    I'm facing same problem using webpack `1.13.0`, this resolves my problem. Strange – Majky Apr 22 '16 at 11:55
  • Also fixed my issue on webpack v1.13.0 on windows 7 and node v6.0, thanks a lot – sgarcia.dev May 05 '16 at 13:31
  • 1
    It still doesn't work for me. And now, `webpack.OldWatchingPlugin()` was deleted. https://github.com/webpack/webpack/pull/2604/files – harukaeru Jun 29 '16 at 01:18
  • Still useful on 1.13.1 – fastec Jul 27 '16 at 10:49
  • I'm on Windows 10 (build 10.0.14393), WebPack 1.13.2 (via ReactJS react-scripts 0.7.0) and this is still the only solution for me. Before this, it would hot reload sometimes, but entirely unpredictably. Thank you @KallDrexx! – Florian Golemo Oct 31 '16 at 19:45
12

I also just came across this issue and it was because the case of the string for the file in the 'require' function call was different than the filesystem. It was still being included in the bundle, but it wasn't being picked up for live re-bundling with webpack-dev-server. Fixing the require call to have the right case fixed it.

John
  • 2,894
  • 2
  • 20
  • 25
0

I was also stuck with this issue. So I found another solution if any of the above do not work for you. If you use Chrome, you can install an extension called "clear cache" or any other that can clear the cache. Just clear the cache using this extension and then reload the page and you would see the changes. So yes, it may not be the way you want it to work but just an alternate. :)

Vishal Chhatwani
  • 167
  • 1
  • 4
  • 14
0

I had similar situation but with single file. The problem was that the path of component had letter in different case instead of letters in directory path.

Directory:

components/UI/fields/

ERROR: (incorrect case of "F" in "Fields")

import PrivacyField from 'components/UI/Fields/PrivacyField';
...

CORRECT:

import PrivacyField from 'components/UI/fields/PrivacyField';
...
Ukr
  • 2,411
  • 18
  • 16