styled-components

参考：

　　http://www.alloyteam.com/2017/05/guide-styled-components/　　

　　https://medium.com/styled-components/getting-sassy-with-sass-styled-theme-9a375cfb78e8

　　https://juejin.im/entry/59473d2fda2f6000678468cb

　　http://web.jobbole.com/91506/

使用方式主要是 模板字符串 和 标签模板（函数的独特调用形式）。

使用标签模板，会返回一个React组件，可以在定义的时候通过props获取到外部传递进来的数据；

组件生成的元素上会被自动加上一个随机的类名，以达到不冲突的目的。

使用这种组件有利于逻辑与样式的分离（分离成逻辑组件和展示组件，展示组件内部使用style-components）

css module是js和css分离的写法

styled-components是在js中写css，这种css in js模式是新一代react组件样式解决方案，可以在js中写条件判断，使用的时候更加简洁和语义化，对比以下两种方式：

<TinyBitLongerStyleName></TinyBitLongerStyleName>
<div className={styles.longerStyleName}></div>