publicdata/j40-cejst-2
1
0
Fork 0
mirror of https://github.com/DOI-DO/j40-cejst-2.git synced 2025-02-21 09:11:26 -08:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix inlined css in every single page. (#369)

Browse source 
Fix for issue #366
* Create gatsby-ssr.js
Note: SSR means "server side rendering". This fix is from a long github discussion about how broken including all css inline in the file is. (Especially since newer CSP guidelines say all css should be in a separate file.)

* PR code review fixes
* Check el.props['data-href'] is valid
* Add comment for production only.
This commit is contained in:
TomNUSDS 2021-07-16 22:09:55 -07:00 • committed by GitHub
parent 4ea93e77ba
commit dca7980195
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 25 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
client/gatsby-ssr.js Normal file
View file

@ -0,0 +1,25 @@
/* this is a hack to fix `gatsby-plugin-sass` from including the
css in every single file (which is > 120k lines).
see: https://github.com/gatsbyjs/gatsby/issues/1526
`ssr` means server-side rendering.
*/
export const onPreRenderHTML = ({getHeadComponents}) => {
if (process.env.NODE_ENV !== 'production') { // ONLY run in production
return;
}
getHeadComponents().forEach((el) => {
// Remove inline css. https://github.com/gatsbyjs/gatsby/issues/1526
if (el.type === 'style' && el.props['data-href']) {
el.type = 'link';
el.props['href'] = el.props['data-href'];
el.props['rel'] = 'stylesheet';
el.props['type'] = 'text/css';
delete el.props['data-href'];
delete el.props['dangerouslySetInnerHTML'];
delete el.props['children'];
}
});
};