UNPKG

980 BMarkdownView Raw
1# inline-css-loader
2Webpack loader for Radium Style Tag
3
4It only modifies the module.export object.
5It allows you to use seperate files for CSS Objects to use in Radiums Style Component.
6It allows you to use known Less/Sass Features.
7
8Currently Supported:
9* nested Objects
10* comma seperator
11* &
12
13# Example
14```
15export default {
16 '.foo': {
17 '.bar': {
18 width: 100
19 },
20 '&.batz': {
21 width: 200
22 },
23 'img, a': {
24 backgroundColor: 'red'
25 }
26 }
27}
28```
29Radium can not process this Object as it has nested CSS Selector. Once loaded with this loader it will look like this:
30```
31export default {
32 '.foo .bar': {
33 width: 100
34 },
35 '.foo.batz': {
36 width: 200
37 },
38 '.foo img': {
39 backgroundColor: 'red'
40 },
41 '.foo a': {
42 backgroundColor: 'red'
43 }
44}
45```
46Now you have an Object Radium can use as Rules for a Style tag.
47
48# Note
49The loader can only handle ES5.
50Please use babel before this loader.
51I've just used ES6 export style for readability