在react项目中使用less:
1.首先安装less和less-loader:npm install less less-loader --save-dev
2.还需要在webpack中进行配置:运行npm run eject,运行完毕后项目中会多出一个config的文件夹
找到webpck.config.js,大约50行的位置添加less
代码:
// 新加less
const lessRegex = /\.less$/
const lessModuleRegex = /\.module\.less$/
然后在module对象中的rules中解析less
代码:
// less 新加
{
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了