vue3+vite全局引入mixin.scss

将公共的CSS提取出来，可以简化CSS的编写，一般将mxin单独写在一个叫mixin.scss文件当中，全局引入。

1.scss文件（mixin.scss）

// 设置宽高

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

2.配置vite

//vite.config.ts

css: {
  preprocessorOptions: {
    scss: {
      additionalData: '@import "@/styles/mixin.scss";'
    }
  }
}

3.使用

<style lang='scss' scoped>
.header {
  @include wh(100px, 100px);
}
</style>

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