vue 项目中全局引入 scss 方法

在 vue.config.js 中 编写webpack参数

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  css: {
    loaderOptions: {
      // 给 sass-loader 传递选项
      sass: {
        additionalData: `@import "@/assets/style/color.scss";`
      },
    }
  }
})

以上是引入Scss的，不同语言不同，具体可以看
https://cli.vuejs.org/zh/guide/css.html#%E5%90%91%E9%A2%84%E5%A4%84%E7%90%86%E5%99%A8-loader-%E4%BC%A0%E9%80%92%E9%80%89%E9%A1%B9

引入多个scss ↓

const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
  transpileDependencies: true,
  css: {
    loaderOptions: {
      // 给 sass-loader 传递选项
      sass: {
        additionalData: `@import "@/assets/style/fx.scss";@import "@/assets/style/color.scss";`
      },
    }
  }
})

tips:

在 main.js 中引入scss，写在页面上自定义的样式都不可行，兄弟们别浪费时间