Skip to content
This repository has been archived by the owner on Dec 25, 2018. It is now read-only.

Styles imported in an async split bundle are incorrectly filtered out #111

Open
vitosamson opened this issue May 27, 2017 · 1 comment
Open

Comments

@vitosamson
Copy link

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

@vitosamson
Copy link
Author

After a little digging I've found the following:

  • src/Child.js is never included in filesToSearch here
  • this is probably due to Child being in a different chunk (it's not in the main chunk's files)
  • the Child chunk is included in compilation.chunks here, however since ExtractTextPlugin pulls all child chunks css into the main chunk, there are no assetsToPurify for 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.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant