前端项目报错this.getOptions is not a function 解决方案。

场景

前端项目不管的Vue还是React, 在安装scss后,使用样式时就会导致编译出错。

原因

是因为sass-loader的版本太高了。

解决

当然是降低sass-loader的版本啦。

   yarn add sass-loader@8.x

或者

   npm install sass-loader@8.x

如果出现安装失败等情况，则需要卸载了再重装。

 yarn remove sass-loader

或

npm uninstall sass-loader

可能有的同学安装了低版本的sass-loader 依然还是不行。其中一个可能是因为sass和sass-loader的版本不匹配。目前我并没在网上找到版本对应表。不过我们可以在安装的sass-loader 中查看package.json的依赖信息。

有的项目用的node-sass 直接看node-sass的版本,而我用的dart-sass看sass的版本号。

• 题外话: node-sass由于网络问题对国内用户太不友好了，经常出现安装失败的情况。强烈建议使用dart-sass, 但是你如果你是老项目或者你非要使用 node-sass,可以试试这个 安装node-sass失败解决方案 。
• 注: 在切换sass-loader版本后, 有的版本无法正确解析 /deep/: 这时候换成 >>> 或者 ::v-deep。