vue3.0全局引入sass

在项目开发过程中，有一些共同的sass样式我想抽出封装到一个文件，利用sass的mixin语法来封装变量，但是在这个过程中一直会报错，先是识别不出来@mixin 和@include，后来是报错sass等一些插件的问题。后来是这样解决的：

首先需要安装以下这些依赖：

"sass": "^1.56.1",
"sass-loader": "^13.2.0",
"sass-resources-loader": "^2.2.5",

安装方式：

npm install sass sass-resources-loader sass-resources-loader --save-dev

其次是在vue.config.js中这样配置：

chainWebpack(config) {
    const oneOfsMap = config.module.rule('scss').oneOfs.store
    oneOfsMap.forEach(item => {
      item
        .use('sass-resources-loader')
        .loader('sass-resources-loader')
        .options({
          // Provide path to the file with resources
          // 要公用的scss的路径
          resources: ['./src/styles/variables.scss', './src/styles/mixin.scss']
        })
        .end()
    })
  },

这样就能全局使用sass了