search

nearform / react-pwa

Hackernews Progressive Web Application built with React
https://hackernews.nearform.com
27 stars 14 forks source link

Version of react-pwa with css modules #48

Open dberesford opened 6 years ago

dberesford commented 6 years ago

In a similar fashion to how we have a branch of react-pwa that replaces saas with 'css-in-js' (https://github.com/nearform/react-pwa/pull/39), let's do a version of react-pwa that uses css modules, i.e. a 'css in css' approach :-)

We're using css modules on some projects with great success. https://github.com/css-modules

cc @bcameron @dancork

temsa commented 6 years ago

Quite easy to do using PostCSS :)

fromflux commented 6 years ago

I'd recommend using http://cssnext.io/ to get the advantages of css modules with PostCSS and make use of modern/future standard css syntax.

dancork commented 6 years ago

cssnext has been deprecated in favour of postcss-preset-env. However, I don't think that gives true CSS modules support if I remember correctly.

The webpack implementation of CSS modules allows you to import CSS in to CSS and compose classes without creating duplication. PostCSS allows you to use @import but it can cause a lot of duplication and is not as powerful.

fromflux commented 6 years ago

Another thing it would be interesting to look at is the story around theming with these tools and how it compares with the css-in-js side.