Using Sass and PostCSS Together

on YouTube ↗21m

" summary

Combines a Sass->CSS Gulp pipeline with PostCSS plugins so Sass compiles non-CSS features and PostCSS then Autoprefixer adds exact vendor prefixes, cssnano minifies, and postcss-sorting orders properties to improve gzip. Shows a simple Gulp task array that runs PostCSS on the compiled CSS, cites plugins like CSSNext and Lost Grid for custom syntax, and flags risks: only run PostCSS on valid CSS and test polyfill-ish transforms because the plugin-generated fallbacks aren’t identical to native implementations.

AI-written summary · about

" chapters (7)

1. 0:00Introduction to talk
2. 2:10Sass vs PostCSS mindset
3. 6:04Strengths of Sass and PostCSS
4. 11:22Combining Sass and PostCSS
5. 13:50Practical PostCSS tips
6. 18:03PostCSS plugins showcase
7. 20:53Conclusion and Q&A

" related talks

• 52mPostCSSAndreas Sahle · Frontend United 2016
• 17mPostCSS - JS Your CSSLachlan Priest · CSSConf.Asia 2015
• 47mPostCSS. The Treasure MapNaiara Abaroa · Codemotion Madrid 2016
• 25mBuild Your Own Development Process With PostCSSCory Tanner · UX Burlington 2016
• 50mAn Introduction to GulpTim Erickson · MidCamp 2019
• 45mFront-End Workflows with GulpBermon Painter · FITC Web Unleashed 2014
• 48mModular CSSAndrey Okonechnikov · HolyJS 2016
• 20mHow can Javascript improve your CSS mixinsSandrina Pereira · JSConf Budapest 2017