styled-components

安装

yarn add styled-components

全局样式 

reset.js文件

import {createGlobalStyle} from 'styled-components';
export const GlobalStyled = createGlobalStyle`
body{
    margin:0;
    padding:0;
    background:red;
}`

 app.js文件

import React from 'react';
import {GlobalStyled} from './style.js';
class App extends React.Components{
	render(){
	    return(
	        <div className='App'>
	            <GlobalStyled />
	        </div>
	    )
	}
}

单个组件样式

style.js文件

import styled from 'styled-components';
export const HeaderWrapper = styled.div`
    height:100px;
    background:orange;
`

header.js页面组件

import React,{Component} from 'react';

import {HeaderWrapper} from './style.js';

class Header extends Component{
    render(){
        return (
            <HeaderWrapper></HeaderWrapper>
        )
    }
}
export default Header;