1.需要下载less和less-loader,且把less-loader降到6.0.0

cnpm i less less-loader@6.0.0 -S

2.运行npm run eject使得自动生成webpack.config.js文件,对其进行修改配置
3.在webpack.config.js里面,添加如下代码:

const lessRegex = /\.less$/;
const lessModuleRegex = /\.module\.less$/;

4.修改公共函数getStyleLoaders(),添加如下参数:
在这里插入图片描述
5. 在配置sass的loader下面添加less配置的loader

{
              test: lessRegex,
              exclude: cssModuleRegex,
              use: getStyleLoaders({
                importLoaders: 1,
                sourceMap: isEnvProduction && shouldUseSourceMap,
              },
              {
                lessOptions:{
                  javascriptEnabled: true
                }
              }
              ),
              sideEffects: true,
            },
            { 
              test: lessModuleRegex,
              use: getStyleLoaders({
                importLoaders: 1,
                sourceMap: isEnvProduction && shouldUseSourceMap,
                modules: true,
                getLocalIdent: getCSSModuleLocalIdent,
              },
              {
                lessOptions:{
                  javascriptEnabled: true
                }
              }
              ),
},  

6.npm run start重启项目即可

Logo

腾讯云面向开发者汇聚海量精品云计算使用和开发经验,营造开放的云计算技术生态圈。

更多推荐