glamor

glamor 是一款 css-in-js 的插件。

安装引入：

1. 安装： npm install glamor --save；
2. 引入：import {css} from 'glamor'；

使用：

const styles = {
	container: css({
		color: 'red',
		fontWeight: 'bolder',
		  ':hover': {
		    color: 'pink'
		  },
		  '@media(min-width: 300px)': {
		    color: 'green',
		    ':hover': {
		      color: 'yellow'
		    }
		  }
	})
}

<div {...styles.container}>哈哈哈哈</div>

有多个 class 属性时，有以下三种写法：

const styles = {
	box: css({
		width: '100px',
		height: '100px',
	}),
	title: css({
		color: 'red'
	}),
}

// 写法一：
<div {...css(styles.box, style.title)}>哈哈哈哈</div>
// 写法二
<div {...styles.box} {...styles.title}>哈哈哈哈</div>
// 写法三
<div className={`${styles.box} ${styles.title}`}>哈哈哈哈</div>