Question

在我的vue 2应用程序中，想要定义下面的媒体断点

@include media-breakpoint-between(md, lg){
  body {
      background-color: red;
  }
}

因此在vue文件bootstrap.scss中导入 @import＆＃34;〜../../ node_modules / bootstrap / scss / bootstrap.scss＆＃34 ;;

但是在npm run dev

上面的导入失败错误

ERROR in ./node_modules/css-loader!./node_modules/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-6a244a7e","scoped":false,"hasInlineConfig":true}!./node_modules/sass-loader/lib/loader.js!./node_modules/vue-loader/lib/selector.js?type=styles&index=1&bustCache!./client/App.vue
Module build failed:
undefined
       ^
      Argument `$map2` of `map-merge($map1, $map2)` must be a map

解决此问题的任何建议

Answer 1

我在使用Bootstrap 4和Material Design Icons时遇到了类似的问题。结果是变量名称冲突，通过重新排列导入顺序解决了。

如果您提供额外的错误输出和/或更多源代码，我可以提供额外的帮助。

Vue 2 Webpack 3 Bootstrap 4 scss定制

1 个答案: