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了
原文链接:https://blog.csdn.net/qq_42132814/article/details/114885417