一 背景

在vue2我的项目上应用less,装置了 less 和 less-laoder之后，编译我的项目的时候提醒上面问题：
Module build failed (from ./node_modules/less-loader/dist/cjs.js): TypeError: this.getOptions is not a function

二 排查问题

在网上搜寻，有文章说是less-loader版本太高了，装置低版本的就没问题啦，比方5.0.0。看了下我以后装置的是less-loader@8.0.0,降级到less-loader@v5.0.0之后也的确好了。然而事件真的那么简略吗？为什么高版本不能够？为什么是5.0.0?

我去看之前跑的没有出问题的我的项目版本是v7.2.0，这个版本也没有问题，起初再仔细搜索发现是高版本的less-loader的配置变了。
之前应用less-loader 倡议配置:

// webpack.config.jsmodule.exports = {    ...    module: {        rules: [{            test: /.less$/,            use: [{                loader: "style-loader"            }, {                loader: "css-loader"            }, {                loader: "less-loader",                 options: {                    strictMath: true,                    noIeCompat: true                }            }]        }]    }};

留神用的是options:{}。
然而在8版本，官网给出的是：

module.exports = { module: {   rules: [     {       test: /.less$/i,       use: [         {           loader: "style-loader",         },         {           loader: "css-loader",         },         {           loader: "less-loader",           options: {             lessOptions: {               strictMath: true,             },           },         },       ],     },   ], },};

留神这里的是options: {lessOptions:}}

发现8 版本有一次大的降级：

之前咱们应用~来解决门路援用问题，当初8版本解决掉了这个bug,能够不再依赖～了，随之带来的是配置文件字段产生了扭转。

三 解决问题

好了，既然曾经晓得是8版本配置产生了变动，那就好解决了。

基本解决

把之前的options稍加批改，加上lessOptions:

module.exports = {    ...    module: {        rules: [{            test: /.less$/,            use: [               ...               {                loader: "less-loader",                 options: {                    + lessOptions: {                        strictMath: true,                        noIeCompat: true                    + }                }            }]        }]    }};

vue-cli

如果你是应用vue-cli创立的我的项目，能够在vue.config.js上自定义less-loader配置：

chainWebpack: config => { config.module .rule('less') .use('less-loader') .loader('less-loader') .options({    lessOptions: {    /**less-loader 配置 */      strictMath: true,      noIeCompat: true    } })

疾速解决

最简略的解决办法就是升高版本了，8的上一个版本是7.3.0，所以咱们想在不扭转配置的状况下解决问题，降级到7.3.0就OK：

  npm install less-loader@7.3.0 --save-dev