Fix inlined css in every single page.

[TomNUSDS]

Fix for issue #366

Created a gatsby-ssr.js to manually remove the css styles embedded in the pages.

SSR means "server side rendering". This fix is from a long github discussion about how broken including all css inline in the file is.

The patch came from here: gatsbyjs/gatsby#1526 (comment)

But honestly, I can't believe there is no flag to control this behavior and the issue was marked "Closed" by the Gatsby folks the way it works now. Especially since newer CSP guidelines say all css should be in a separate file.

The outputted file size for main index.html

Before:   462,099 bytes
After:      3,191 bytes

This is for every single statically generated page.

I tested locally but we should watch for production build issues.

[NatHillardUSDS]

Hm, interesting catch, but if it's not running on our prod builds I'm not sure I see the reasoning, though I may be misreading this / misinterpreting the purpose.

In any case it does seem like one of the commenters had to check for a particular property's existence so marking as request changes at least for that; otherwise I'd be curious to tie this back to real-world repercussions also if we can

[vim-usds]

What a creative fix! Is it safe to say that the styles were duplicated (in-line) and external and this is now just pointing to the external stylesheet?

[TomNUSDS]

What a creative fix! Is it safe to say that the styles were duplicated (in-line) and external and this is now just pointing to the external stylesheet?

Yes. The gatsby build processes the files to produce static html output for deploying web pages. This hooks into it to fix an odd behavior in the gatsby sass processing plugin.

[TomNUSDS]

Hm, interesting catch, but if it's not running on our prod builds I'm not sure I see the reasoning, though I may be misreading this / misinterpreting the purpose.

In any case it does seem like one of the commenters had to check for a particular property's existence so marking as request changes at least for that; otherwise I'd be curious to tie this back to real-world repercussions also if we can

This gatsby sass plugin hasn't been worked on in a long time and I'm confused why they closed this issue without fixing it. The real fix is to add a flag to the plugin to control this behavior, not have everyone stub their toe on it and then have to add custom code.

[NatHillardUSDS]

Apologies for my misreading, clearly I have Friday Brain. Would be good to go with that extra check I think

[NatHillardUSDS]

LGTM, and good catch!