这种基本上就是安装个less/scss和对应的loader，然后去webpack里配置一下。
create-react-app脚手架生成的项目默认隐藏掉了webpack配置，所以配置less/scss之前先把配置文件暴露出来：
npm run eject
一.less
1.首先是下载less和less loader：
yarn add less less-loader
2.修改config/webpack.config.js
添加下面两行：
const lessRegex= /\.less$/;
const lessModuleRegex=/\.module\.less$/;
然后添加lessRegex和lessModuleRegex：
{
test: sassModuleRegex,
use: getStyleLoaders(
{
importLoaders: 3,
sourceMap: isEnvProduction && shouldUseSourceMap,
modules: {
getLocalIdent: getCSSModuleLocalIdent,
},
},
'sass-loader'
),
},
//下面为新添加的，上面代码只是帮助你找到添加代码的位置@_@
{
test: lessRegex,
exclude: lessModuleRegex,
use: getStyleLoaders(
{
importLoaders: 3,
sourceMap: isEnvProduction && shouldUseSourceMap,
},
'less-loader'
),
sideEffects: true,
},
{
test: lessModuleRegex,
use: getStyleLoaders(
{
importLoaders: 3,
sourceMap: isEnvProduction && shouldUseSourceMap,
modules: {
getLocalIdent: getCSSModuleLocalIdent,
},
},
'less-loader'
),
},
至此less配置完成。
二.scss
1.首先还是安装：
yarn add node-sass@4.14.1 sass-loader
这里有同学要问了，为什么要装4.14.1呀？
嗯，这里如果yarn add node-sass的话给你装的是最新的版本，我这个时间点的话是5，
（可以用yarn info node-sass或者npm view node-sass version查看包最新版本（推荐后者））
5的话会报错，Error: Node Sass version 5.0.0 is incompatible with ^4.0.0.
解决：
先卸载已安装版本:npm uninstall node-sass或者yarn remove node-sass，
再重新安装node-sass
（有时卸载完会报错，重启下编辑器试试）
2.配置webpack
用create-react-app生成的项目webpack里面已经配好了sass和scss（我也是在配置less的时候发现的，有配置但没给你安装node-sass和loader，你说奇不奇怪），所以不需要配置了。
至此scss配置完毕。
