PostCSS Config: Add postcss-critical-split
Closed this issue · 1 comments
ocean90 commented
Related to https://github.com/wearerequired/wordpress-theme-boilerplate/issues/132
diff --git packages/postcss-config/index.js packages/postcss-config/index.js
index 73f1382..f1bfe89 100644
--- packages/postcss-config/index.js
+++ packages/postcss-config/index.js
@@ -15,6 +15,9 @@ module.exports = ( ctx ) => {
grid: true,
},
} ),
+ require( 'postcss-critical-split' )( {
+ output: process.env.CRITICAL_CSS ? 'critical' : 'rest',
+ } ),
require( 'postcss-sort-media-queries' )( {
sort: 'mobile-first',
} ),
To create the stylesheet with the critical CSS you'd have to run:
NODE_ENV=production CRITICAL_CSS=true postcss assets/css/src/style.css -d assets/css/dist --ext '.critical.css'
To make it compatible with PostCSS 8 (#54) I have submitted a PR upstream: mrnocreativity/postcss-critical-split#22
ocean90 commented
Closing since postcss-critical-split is no longer maintained.