Hacker News new | ask | show | jobs
by casesandberg 3666 days ago
React CSS Modules does not allow you to use props or state to style your component. Say you wanted to use a button <Button color="#aeee00" /> you could map the color prop directly to CSS.
1 comments
haukur 3666 days ago
There is nothing preventing you from using (React) CSS modules & state/props. Use the allowMultiple option if you need more than one classname (base classname + modifier).
link
casesandberg 3666 days ago
But how does that work if this translates everything to traditional CSS?
link
haukur 3666 days ago
You write CSS files and import them in your component. By using Webpack you would do something like this in your component:

    import CSSModules from 'react-css-modules';
    import styles from './styles'; // This is a styles.css file in the same dir
    
    const Component = () => <p styleName="welcome">Hello, world!</p>;

    export default CSSModules(Component, styles);
The stylesheet import is just Webpack doing its thing, using css-loader. Example config: https://github.com/hph/kit/blob/master/webpack.config.js

Sorry if I misunderstood your question.

link