purifycss-webpack
purifycss-webpack copied to clipboard
Styles imported in an async split bundle are incorrectly filtered out
Minimal repro project: https://github.com/vitosamson/purifycss-webpack-repro.
There are two entry points: src/split and src/not-split. Both pull in src/Child, but split does so via require.ensure for async code splitting. Child imports react-select's css.
The split css bundle for some reason is 3kb smaller than the non-split bundle. One example of a missing css rule is .Select-arrow-zone.
It's not clear to me why the two entries are being treated differently. Clearly at least some of the css selectors in the split bundle are being picked up, but not all of them.
purifycss-webpack: 0.7.0 webpack: 2.6.1 node: 6.9.1 OS: OSX 10.11.1
After a little digging I've found the following:
src/Child.jsis never included infilesToSearchhere- this is probably due to
Childbeing in a different chunk (it's not in the main chunk'sfiles) - the
Childchunk is included incompilation.chunkshere, however since ExtractTextPlugin pulls all child chunks css into the main chunk, there are noassetsToPurifyfor it here - the only asset that chunk has is its .js
I'm not really sure how to work around this. I also can't figure out why the split css bundle includes any react-select styles at all, rather than dropping all of them since Child is never included in the files to search.