Why not just use the style attribute of elements? Polyfill support available here: http://vanilla-js.com/, but if you have a modern browser, like IE5+ you should be OK.
Still, almost all pages (at least most web applications) need media queries for their layout as well as for their individual components.
I think the author of this little 10LOC script is well aware of the style attribute so I fail to see what you want to say with your original comment.
Especially the link - you do realize that this script is written in simple "vanilla js", right?
But soon grows into a mess. Legitimate use cases exist, but there are many obvious reasons to avoid using it as the main driver of page css.
@media lg { /* As many lg properties you like instead of adding lg: to everything. */ }
https://developer.chrome.com/articles/css-nesting/#nesting-m...
Tailwind has a similar directive in external CSS files. Pun: it's not called @media. But the DSL again has some benefits here.
@apply + @screen is more powerful than what's possible in vanilla CSS. Especially regarding nesting and enforcing the design system breakpoints. Tailwind is pretty closely related to PostCSS in this regard, and keeps its syntax extensions close to proposals that might one day become standards (nesting, custom media queries etc)
But using Tailwind and focusing on external CSS files seems like the worst of both worlds.
I have to say, in a React context I prefer styled components or simple external CSS, but in my previous job Tailwind was a godsend. Having to churn out large amounts of CSS in a quick yet precise manner, involving other team members who might have different habits and knowledge levels, this is where Tailwind shines for me.