vue项目npm less 后使用报错

问题描述：在vue中 npm 引入less 后，编译报错，具体错误信息可查看下边的报错信息。后经过查证，是因为less-loader的版本过高造成的，emmmm… 好了问题已经找到后，直接更改less-loader的版本即可。首先移除原来的less-loader 然后在重新npm指定版本。

一、vue引入less编译命令

npm install less less-loader --save

二、报错信息

1.报错信息 img

2.报错信息 .log

 10% building modules 0/1 modules 1 active ...de_modules\css-loader\lib\css-base 10% building modules 0/2 modules 2 active ...发\beva_weixin\src\components\user 11% building modules 1/2 modules 1 active ...de_modules\css-loader\lib\css-base 94% asset optimization ERROR  Failed to compile with 1 errors10:12:56
 error  in ./src/components/user.vue
Module build failed: TypeError: loaderContext.getResolve is not a function
    at createWebpackLessPlugin (E:\wangyc_code\贝瓦儿歌_微信端H5开发\beva_wx_h5\微信vue框架开发\beva_weixin\node_modules\less-loader\dist\utils.js:31:33)
    at getLessOptions (E:\wangyc_code\贝瓦儿歌_微信端H5开发\beva_wx_h5\微信vue框架开发\beva_weixin\node_modules\less-loader\dist\utils.js:148:31)
    at Object.lessLoader (E:\wangyc_code\贝瓦儿歌_微信端H5开发\beva_wx_h5\微信vue框架开发\beva_weixin\node_modules\less-loader\dist\index.js:27:49)

 @ ./node_modules/vue-style-loader!./node_modules/css-loader?{"sourceMap":true}!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-7b4b534a","scoped":false,"hasInlineConfig":false}!./node_modules/less-loader/dist/cjs.js?{"sourceMap":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/components/user.vue 4:14-370 13:3-17:5 14:22-378
 @ ./src/components/user.vue
 @ ./src/router/index.js
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://192.168.170.101:8080 webpack/hot/dev-server ./src/main.js

三、解决问题【是因为less-loader版本过高，降低版本即可】

首先将原来的 less-loader 删除

npm uninstall less-loader

然后在重新npm less-loader

npm install less-loader@4.1.0 --save

四、

这个时候，上述问题应该以及正常解决，重新编译 npm run dev 即可