#PostCSS もそろそろ使わなくてもいいかもな…
#PostCSS
We lost so much when dropping Sass for PostCSS.
CSS built-in nesting is awkward, static variables can be useful actually, and what's the point of dropping a consistent API with good DX if we're still transforming our stylesheets anyways?
Chaining together interoperable PostCSS modules to accomplish half of what Sass can do is nearly impossible.
After reading this, checked my existing styling as processed through autoprefixer, found the few vendor prefixes that had been added, and manually added them to my styling — so it now doesn’t require any additional tools for cross-browser compatibility.
I'm playing with Bulma and Astro and I'm having a weird error trying to overwrite a Bulma Sass variable.
```
[postcss] Found unknown node. Make sure to provided all involved nodes. Unknown node: "--color-100"
```
This is my `global.scss` file:
```
@use "sass:color";
@use "../../node_modules/bulma/sass";
$family-primary: 'system-ui, sans-serif'
```
(I tried earlier using `@use with` and got the same error)
I had disabled postcss on my `astro.config.mjs`:
```js
import { defineConfig } from 'astro/config';
// https://astro.build/config
export default defineConfig({
postcss: false,
});
```
What can be happening? Yes, I know is recognizing all the other variables but, do I have to disable postcss anywhere else? Any idea how can I avoid this error without checking every other Bulma variable?
Thank you!
Post >> TIL some info about PostCSS Preset Env and Browserslist • When all else fails, I go to the source and ask.
https://www.brycewray.com/posts/2024/02/til-some-info-postcss-preset-env-browserslist/
Just learned something I’d hoped was true: if your project has a more updated version of browserslist than what’s in postcss-preset-env, postcss-preset-env will use the better data instead of what’s in its own browserslist dependency:
https://github.com/csstools/postcss-plugins/discussions/1299
Post >> Using Lightning CSS with Hugo: back to the workaround • Why a clear separation between dev mode and prod mode made sense.
https://www.brycewray.com/posts/2024/02/using-lightning-css-hugo-back-workaround/
I made a contribution to browserslist:
https://github.com/browserslist/browserslist/pull/819
I have been trying to get the Lume static site generator to run inside a #Dropserver sandbox, but I have been running into all kinds of issues: some modules written for #NodeJS assume they have read permissions for the entire disk, and error out when you run them with restrictive permissions. Any project that uses #PostCSS + #autoprefixer (ie most build systems) will hit this.
https://github.com/browserslist/browserslist/issues/813
1/2
(Restoring an earlier item that I briefly removed when I encountered, and subsequently fixed, a local glitch...)
Post >> Using Lightning CSS with Hugo — without workarounds • With a little tinkering, there’s no need for that PostCSS plugin I recently mentioned.
https://www.brycewray.com/posts/2024/02/using-lightning-css-hugo-without-workarounds/
Any #PostCSS users know how I can include other CSS files with a prefix. Use case is that I want to import two files - light and dark themes for #highlightjs, but dark mode needs all selectors to be scoped with an additional `.dark` class prefix
New post >> Using Lightning CSS with Hugo • Does Hugo natively support Lightning CSS? No, but there’s a neat workaround for that.
https://www.brycewray.com/posts/2024/01/using-lightning-css-hugo/
...well I did promise a part 3, so let's close it off!
JAVASCRIPT WEB TOOLS.... but a Trading Card Game! (PART 3 of 3)
21: #PostCSS - "A tool for transforming CSS with JavaScript plugins."
Как автоматизировать использование дизайн токенов с помощью Stylelint и PostCSS
Привет, Хабр! Меня зовут Саша и вот уже 7 лет я работаю фулстек разработчиком и пишу на C# и TypeScript/React. Сегодня я хотел бы поделиться своим небольшим успехом в автоматизации. В какой-то момент я понял, что во время код ревью я указываю разработчикам на одни и те же ошибки. Но, что ещё хуже, я сам время от времени допускаю эти ошибки. Сегодня хочу рассказать об одной из таких проблем, которую я решил с помощью PostCSS + Stylelint, и о том, как я это сделал. Статья будет полезна для разработчиков, которые уже используют или собираются использовать дизайн токены. Начнём!
https://habr.com/ru/articles/779492/
#javascript #stylelint #postcss #дизайнтокены #автоматизация #cssпеременные #линтеры #typescript #плагины
Looking to move away from Sass (#SCSS) to pure #CSS now that pretty much all functionality exists in #CSS. The only remaining feature that I would need some kind of processor/bundler for is for combining different files (I like to separate everything).
Any tips for a good bundler? Is #PostCSS the thing to go for?
#Development #Reviews
CSS is fun again · Why it’s time to revisit CSS if you have lost sight of it https://ilo.im/15ek6d
“The pace of new features has accelerated so much, that I envy those who are just learning CSS today.” — Jeff Sandberg
@nachtfunke ah. okay. thanks for that clarification. that makes sense actually. but is that specific to sass?
Are you the guy* who was talking about #PostCSS ?
( *RE: sleep disorder. sometimes zombie functioning. i remember tags and avatars. but it's kind of like trying to remember a near blackout. function also of very poor sleep habits, no real schedule. a person like me needs strict discipline to avoid those symptons )
Starting to think about transitioning off of Sass to “modern CSS” with postcss-preset-env for downlevel transformation. Mostly because someday we’ll have native CSS nesting support which should really reduce the size of stylesheets. I haven’t found a great PostCSS replacement for inlined constants like Sass has though. #CSS #postcss #sass
Client Info
Server: https://mastodon.social
Version: 2025.04
Repository: https://github.com/cyevgeniy/lmst