filewatcher-webpack-plugin icon indicating copy to clipboard operation
filewatcher-webpack-plugin copied to clipboard

How to force reload webpack on change

Open nusson opened this issue 6 years ago • 2 comments

Hi, thanks for your plugin !

It's not a bug but I'm sure it would be helpfull to add this to your doc fo newbies like me ;)

I've setup a webpack to build my css/js files but would like to reload my page when I change php (twig) files - witch aren't process by webpack

So i found your extention, witch seems to work since I have logs when editing my twig files

[WDS] App updated. Recompiling...
[WDS] Nothing changed.

So I've tryed to handle the file change myself

    new FileWatcherPlugin({
      watchFileRegex: ['./templates/**/*.twig'],
      onChangeCallback: (a, b)=>{
       // I see these logs
        console.log('change', a);
        console.log('change2', b);

       // I WANT TO FORCE RELOAD HERE
      }
    })

but don't know how to send the reload signal from there

Could someone help me ?

nusson avatar Mar 20 '18 22:03 nusson

If you're using webpack dev server, I believe it is not possible to reload manually. I got around this problem by using browserSync. I used this plugin here https://www.npmjs.com/package/browser-sync-webpack-plugin.

Instantiate the plugin before defining webpack config. Pass the reference to the plugin to the webpack config. You can then reload the server by calling [reference].browserSync.reload()

maximus1108 avatar Apr 10 '18 08:04 maximus1108

but don't know how to send the reload signal from there

Reload or recompile? If the latter, you can, after https://github.com/sap9433/filewatcher-webpack-plugin/issues/6 is fixed, run:

            const callbackContext = this;
            callbackContext.compiler.run(function(err) {
              if (err) throw err;
              callbackContext.watcher.close();
            });

motin avatar Jul 24 '18 09:07 motin