sass之mixin的全局引入(vue3.0)

1.scss文件(mixin.scss)

// 设置宽高

@mixin wh($w, $h) {
    width: $w;
    height: $h;
}

2.配置loader

//vue.config.js
 
css: {
    loaderOptions: {
      sass: {
        prependData: `@import "~@/styles/mixin.scss";`
      }
    }
  }

低版本的用data

//vue.config.js
 
css: {
    loaderOptions: {
      sass: {
        data: `@import "~@/styles/mixin.scss";`
      }
    }
  }

3.使用

在css中直接使用@include调用mixin即可。

你可能感兴趣的:(vue,css,css3)