search

Va1 / browser-sync-webpack-plugin

Easily use BrowserSync in your Webpack project.
MIT License
371 stars 42 forks source link

Detect compilation trigger instead of referencing emitted assets when determining whether to inject css or reload #78

Open farmerau opened 5 years ago

farmerau commented 5 years ago

In lib/getCssOnlyEmittedAssetsNames.js, it's apparent that the logic regarding about whether or not to inject CSS is entirely related about the emitted files. This can work in situations where (S)CSS might not be included in JavaScript, or in situations where spritemaps or manifests aren't being generated.

Instead, determining whether or not we should inject CSS could be determined by checking the triggered source files to see if it's an injectable resource. This can be done in the watchRun compiler hook by setting a flag in the plugin to true or false depending on inspection of the keys in compiler.watchFileSystem.(watcher||wfs.watcher).

If there's interest in implementing this, I've written a webpack plugin which manipulates the values inside stats.compilation.assets. I don't think this is the ideal solution, so I haven't published or made it otherwise public in favor of my hope that we might be able to offer the functionality directly in this plugin. I'm happy to submit a pull-request if this is something people would like to see.

Ideally, there'd be an option to specify the source file extensions (probably via Regular Expressions) for testing against the triggering files.

malinbranduse commented 5 years ago

@farmerau Very good points! If you have the time for sure, do a PR. Thanks for the interest. I haven't had a look at this project in a while and I'm not sure I will have the time as I haven't used it too much.

alexkoepke commented 5 years ago

@malinushj curious are you are using Webpack Dev Server in favor of browser sync? Or are there other reasons for you, "haven't used [this plugin] too much."

malinbranduse commented 5 years ago

@alexkoepke Pretty much, been working with Vue and thus having HMR is much faster and more convenient/easier to setup.

farmerau commented 5 years ago

@malinushj PR created.

Va1 commented 4 years ago

guys, i've commented on the PR and gonna duplicate here as well:

if someone could verify that it works on all webpack versions (1-4), i will make some updates and merge the related PR to enable this, then release a new version. otherwise, i would not risk the stability of the package, as this compiler.watchFileSystem.(watcher||wfs.watcher) feels pretty shady.

thank you