vue2 SASS 定义全局变量

cnpm install -D sass-loader node-sass stylus-resources-loader

在vue.config.js中

pluginOptions: {
    'style-resources-loader': {
      'preProcessor': 'scss',
      'patterns': [
        // 文件路径根据实际情况编写
        path.resolve(__dirname, '@/assets/css/*.scss'),
      ]
    }
  },
  css: {
    loaderOptions: {
      scss: {
        // 文件路径根据实际情况编写
        prependData: `@import "@/assets/css/variable.scss";`
      }
    }
  },

在variable.scss定义css 变量

$theme-color: #fff;

在vue组件中直接使用

.page {
  background: $theme-color;
}