react 配置scss

react框架默认知识scss，所以只需要下载sass-loader和node-sass即可

npm install sass-loader node-sass --save

就可以建立xxx.scss或者xxx.module.scss文件，然后引入项目当中既可以使用

如果是scss后缀结束的时候， import “xxx.scss” 即可，当然后面根据自己的路径而定

如果是module.scss后缀结束，可以 import styles from "xxx.module.scss"  既可，这样就可以把类名局域话，不会重复了，但是用的时候，需要className={styles.xxx}    其中xxx为类名 ，这样系统会自动编译后面会加上序列号，类名不会重复

----------------------------我是突然出现的分割线-------------------------------------

定义变量，如下可以定义变量名

其中 类名为  test-a   

background:red

$c:"a"; $color:red;
.test-#{$c}{   background:$color; }   定义函数 和使用函数   @mixin background($url) {   width: 100%;   height: 100%;   background-size: contain;   background-position: center;   background-repeat: no-repeat;   background: url($url); }   使用过函数   .test{   @include background('./images/logo.png'); }