vue 中使用scss, 报错 Module build failed: TypeError: loaderContext.getResolve is not a function

Dear 丶 2022-11-28 10:34 307阅读 0赞
使用步骤:

1.打开终端,安装sass依赖包

  1. npm install --save-dev sass-loader //sass-loader依赖于node-sass
  2. npm install --save-dev node-sass

2.在build文件夹下的webpack.base.conf.js的rules里面添加以下配置

  1. {
  2. test: /\.scss$/,
  3. loaders: ["style", "css", "sass"]
  4. }

3.修改 style标签 lang=“scss”, 启动项目,报错如下:

  1. Module build failed: TypeError: loaderContext.getResolve is not a function
  2. at getWebpackImporter (D:\idea\component\mall\mall-ui\node_modules\sass-loader\dist\utils.js:278:37)
  3. at Object.loader (D:\idea\component\mall\mall-ui\node_modules\sass-loader\dist\index.js:42:61)
  4. @ ./node_modules/vue-style-loader!./node_modules/css-loader?{ "sourceMap":true}!./node_modules/vue-loader/lib/style-compiler?{ "vue":true,"id":"data-v-fae5bece","scoped":true,"hasInlineConfig":false}!./node_modules/sass-loader/dist/cjs.js?{ "sourceMap":true}!./node_modules/vue-loader/lib/selector.js?type=styles&index=0!./src/views/Home.vue 4:14-369 13:3-17:5 14:22-377
  5. @ ./src/views/Home.vue
  6. @ ./src/router/index.js
  7. @ ./src/main.js
  8. @ multi (webpack)-dev-server/client?http://localhost:8081 webpack/hot/dev-server ./src/main.js
报错解决:

这个错误一般都是由sass-loader版本过高导致的,版本号可以在 package.json 中查看

卸载原来的 npm uninstall sass-loader

安装指定版本 npm install sass-loader@4.1.0 —save

发表评论

表情:
评论列表 (有 0 条评论,307人围观)

还没有评论,来说两句吧...

相关阅读