Multi-SCSS transpilation wrong styles applied

[stickeedavid]

Hi all,

I'm putting this here in case anyone else has the same issue.

Issue:
CSS classes are being applied incorrectly to above-the-fold content.

Cause:
We build several CSS files but do not include all of them on the page we are building critical CSS for. However,
CriticalCSS loads all built CSS via webpack, rather than what is included in the HTML document.

Solutions:

• Add an ID to the body, and wrap all CSS within that ID.

  OR

• Manually specific the CSS filepaths to include via the Critical 'CSS' option. e.g.
  options: { css: [ 'public/css/A.css' ] }

Any better solutions would be appreciated.

Thanks