如何在Quasar模板中使用自定义SCSS变量文件？

方法一：使用CSS自定义属性（推荐） #

1. 在自定义SCSS文件（如src/css/quasar.variables.scss）中，将SCSS变量转换为CSS全局变量：

// src/css/quasar.variables.scss
:root {
  --my-own-color: #你的颜色值;
}

// 保留SCSS变量，方便在组件<style>中使用
$MyOwnVariable: var(--my-own-color);

2. 在quasar.config.js中配置全局引入该文件：

// quasar.config.js
module.exports = function () {
  return {
    css: [
      'src/css/quasar.variables.scss'
    ]
  }
}

3. 在组件属性中直接使用CSS变量：

<q-tabs
  v-model="selectedTab"
  align="left"
  indicator-color="transparent"
  active-color="var(--my-own-color)"
>

方法二：全局注入SCSS变量（仅适用于组件