Error: Rule can only have one resource source (provided resource and test + include + exclude) in

vue-cli项目中安装sass-loader遇到的坑


最近在项目中需要用到sass，安装sass-loader后发生错误：
INFO  Starting development server...
 ERROR  Error: Rule can only have one resource source (provided resource and test + include + exclude) in {
  "exclude": [
    null
  ],
  "use": [
    {
      "loader": "D:\\zenos\\study-vue1\\node_modules\\cache-loader\\dist\\cjs.js",
      "options": {
        "cacheDirectory": "D:\\zenos\\study-vue1\\node_modules\\.cache\\babel-loader",
        "cacheIdentifier": "55e5131a"
      },
      "ident": "clonedRuleSet-38[0].rules[0].use[0]"
    },
    {
      "loader": "D:\\zenos\\study-vue1\\node_modules\\babel-loader\\lib\\index.js",
      "options": "undefined",
      "ident": "undefined"
    }
  ]
}
Error: Rule can only have one resource source (provided resource and test + include + exclude) in {
  "exclude": [
    null
  ],
  "use": [
    {
      "loader": "D:\\zenos\\study-vue1\\node_modules\\cache-loader\\dist\\cjs.js",
      "options": {
        "cacheDirectory": "D:\\zenos\\study-vue1\\node_modules\\.cache\\babel-loader",
        "cacheIdentifier": "55e5131a"
      },
      "ident": "clonedRuleSet-38[0].rules[0].use[0]"
    },
    {
      "loader": "D:\\zenos\\study-vue1\\node_modules\\babel-loader\\lib\\index.js",
      "options": "undefined",
      "ident": "undefined"
    }
  ]
}
可能的原因就是默认的sass或者webpack版本太高了，从而导致不兼容，把之前的高版本卸载，安装低版本就行

卸载当前版本sass-loader命令：npm uninstall sass-loader

安装低版本的sass-loader命令：npm install sass-loader@7.3.1 --save-dev

（需要安装node-sass的话：npm install node-sass --save）

还不行的话：

卸载当前版本webpack命令：npm uninstall webpack

安装低版本的webpack命令：npm install webpack@^4.0.0 --save-dev

https://blog.csdn.net/maxiaoxin1314/article/details/109317126