cloudfour / cloudfour/eleventy-patterns

Add PostCSS to CSS stack

Open
#13 1 comment 1 reaction 0 assignees View on GitHub
✨ enhancement
Dominant language
JavaScript
Stars
4
Forks
0
PR merge metrics
No merged PRs in 30d

Description

In my [Feeling Sassy Again](https://cloudfour.com/thinks/feeling-sassy-again/) article, I mentioned how I thought that Sass was best for proprietary/compiled features while PostCSS was best at browser compatibility and automated/robot stuff.

I think in my ideal world, the CSS stack for this would be something like this...

- We include [a `browserslist` file](https://github.com/browserslist/browserslist).
- PostCSS is configured to run [Preset Env](https://preset-env.cssdb.org/) and [Autoprefixer](https://github.com/postcss/autoprefixer), both of which will change their behavior based on `browserslist`.
- Files ending in `.css` are processed by _just_ PostCSS.
- Files ending in `.scss` are processed by Sass, _then_ by PostCSS.

This will give us:

- The ability to automatically polyfill CSS features based on a project's target browsers.
- The ability to _opt in_ to proprietary Sass stuff when we want to, ignore it if/when we don't need it.

That said, the latter point isn't _super_ important to me. If supporting Sass-less compilation means that importing gets confusing, then that may not be a reasonable trade-off.

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.