You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+19Lines changed: 19 additions & 0 deletions
Original file line number
Diff line number
Diff line change
@@ -7,6 +7,25 @@
7
7
8
8
First you need to setup [webpack](http://webpack.github.io/docs/) to load your css files using "css" loader and enable CSS modules. You will also need to use `extract-text-webpack-plugin` to construct the CSS file. Refer to [webpack-demo](https://github.com/css-modules/webpack-demo).
9
9
10
+
Then you need use the higher order component declaration pattern to encapsulate your component:
11
+
10
12
```js
13
+
importReactfrom'react';
14
+
importstylesfrom'./car.css';
15
+
importCSSModulesfrom'react-css-modules';
16
+
17
+
classCarextendsReact.Component {
18
+
render () {
19
+
return<div className='car'>
20
+
<div className='front-door'></div>
21
+
<div className='back-door'></div>
22
+
</div>;
23
+
}
24
+
}
11
25
26
+
exportdefaultCSSModules(Car, styles);
12
27
```
28
+
29
+
Thats it!
30
+
31
+
CSSModules component will look for CSS classes in `./car.css` that match `ReactElement``className` and will extend the `className` declaration at the time of `render`.
0 commit comments