CODEWITHSUNDEEP
javascriptwebpack
KallDrexx
KallDrexx

Reputation: 27803

Why is webpack --watch not updating when specific files are updated

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?

Upvotes: 19

Views: 11082

Answers (4)

Ukr
Ukr

Reputation: 2704

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';
...

Upvotes: 0

Vishal Chhatwani
Vishal Chhatwani

Reputation: 167

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. :)

Upvotes: 0

John
John

Reputation: 2894

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.

Upvotes: 12

KallDrexx
KallDrexx

Reputation: 27803

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

plugins: [
    new webpack.OldWatchingPlugin()
],

Upvotes: 47

Related Questions