4 ms·
We've been using inline styles in our main project (built with React), but we recently deciced to move to css modules: https://github.com/css-modules/css-modul
by moretti 11y ago
We've been using inline styles in our main project (built with React), but we recently deciced to move to css modules:
https://github.com/css-modules/css-modules https://github.com/css-modules/css-modules
https://medium.com/seek-ui-engineering/the-end-of-global-css-90d2a4a06284 https://medium.com/seek-ui-engineering/the-end-of-global-css...
Inline styles are great, but they don't support basic features such as pseudo classes/elements, so even implementing simple components like buttons was cumbersome.
With latest version of webpack's css loader you get css scoping (you no longer need to add lengthy prefixes to all selectors) and you can also use additional loaders for post-processing your styles (we use a lot of postcss plugins such as autoprefixer).
Have a look at this example:
https://github.com/css-modules/webpack-demo https://github.com/css-modules/webpack-demo
And here's a great comparison of the main CSS in JS techniques:
https://github.com/MicheleBertoli/css-in-js https://github.com/MicheleBertoli/css-in-js