原文地址：https://blog.csdn.net/qq_40652539/article/details/93398864?utm_medium=distribute.pc_relevant_t0.none-task-blog-BlogCommendFromMachineLearnPai2-1.channel_param&depth_1-utm_source=distribute.pc_relevant_t0.none-task-blog-BlogCommendFromMachineLearnPai2-1.channel_param

在vue中引入并使用less時(shí)遇到的一些錯(cuò)誤及解決方案：

1、錯(cuò)誤一：

錯(cuò)誤如下圖所示：

因?yàn)楫?dāng)前項(xiàng)目版本2.9.6 已經(jīng)在build/utils里配置了less的處理，所以和之前在build/webpack.base.conf.js中配置的less-loader沖突

解決方法：

將沖突的less-loader去掉即可，如下圖：

2、錯(cuò)誤一：

錯(cuò)誤如下圖所示：

此類(lèi)為題表示缺少相關(guān)依賴(lài)，根據(jù)關(guān)鍵詞vue-style-loader!css-loader，說(shuō)明是css 解析的時(shí)候出了問(wèn)題。

解決方法：

根據(jù)使用的css語(yǔ)言來(lái)安裝相應(yīng)的依賴(lài)包,命令如下：

常規(guī)css:

npm install stylus-loader css-loader style-loader --save-dev

如果是less：

npm install less less-loader --save-dev

如果是sass:

npm install sass sass-loader --save-dev

或者：

npm install sass-resources-loader --save-dev(我上面的這個(gè)錯(cuò)誤是因?yàn)橐萌值膌ess文件，所以執(zhí)行該命令來(lái)解決此問(wèn)題)

3.錯(cuò)誤三：

錯(cuò)誤如下圖所示：

Module build failed: TypeError: loaderContext.getResolve is not a function

原因：

less-loader版本太高

解決方式：

修改package.json文件：

修改less和less-loader的版本為^3.9和^5.0.0, 然后刪除node_modules文件夾后重新npm install

卸載，并安裝指定版本：

npm uninstall less less-loader

npm install less@3.9 less-loader@5.0.0 --save-dev