问题：按照官网配置按需自动引入加载elementPlus主题之后，主题色修改未成功。

环境：本人使用的是 vue3.2.37 + vite3.1.0 + element-plus2.2.21 + ts4.8.4

1. element scss变量重写。

// elementPlus/variables.scss
@forward 'element-plus/theme-chalk/src/common/var.scss' with (
  $colors: (
    'primary': (
      'base': #22a9c5,
    ),
  )
);

2. vite.config.ts

注意：

1. 如果你配置的是按需引入则需要加入ElementPlus({ useSource: true, }) ;
2. element-plus官方也说明了，推荐使用@use "@/assets/scss/elementPlus/index.scss" as *; 的方式引入覆盖变量；@import '../../xx.scss'未来要废弃的。

export default ({mode,command }:ConfigEnv):UserConfigExport=>{
  return defineConfig({
    resolve: {
      alias: {
        '@': path.resolve(__dirname, 'src'),
      },
      extensions: ['.ts', '.js', '.vue', '.json', '.d.ts', '.tsx']
    },
    css:{
      preprocessorOptions:{
        scss:{
          additionalData:`@use "@/assets/scss/elementPlus/index.scss" as *;` //引入scss文件
        }
      },
      postcss: {
        plugins:[
          autoprefixer({
            overrideBrowserslist:['Chrome>40',"ff > 31","ie >= 8","iOS 7.1"]
          })
        ]
      }
    },
    plugins: [
      vue(),
      AutoImport({
        // 自动导入 Vue 相关函数，如：ref, reactive, toRef 等
        imports: ['vue'],
        // 自动导入 Element Plus 相关函数，如：ElMessage, ElMessageBox... (带样式)
        resolvers: [
          ElementPlusResolver(),
          // 自动导入图标组件
          IconsResolver({
            prefix: 'Icon',
          }),
        ],
        dts: path.resolve('./typings/plugins', 'auto-imports.d.ts'),
      }),
      // 重点使用ElementPlus
      ElementPlus({
        useSource: true,
      }),
      Components({
        resolvers: [
          // 自动注册图标组件
          IconsResolver({
            enabledCollections: ['ep'],
          }),
          // 自动导入 Element Plus 组件
          ElementPlusResolver(),
        ],
  
        dts: path.resolve('./typings/plugins', 'components.d.ts'),
      }),
      Icons({
        autoInstall: true,
      }),
    ],
  })
}

补充点：

1. 如果有自定义scss变量，可以和elementplus的变量一起通过additionalData注入全局。
2. 切记不要把其他的scss文件一并通过additionalData注入全局，这样会造成页面加载慢，主要原因是scss会多次被覆盖，造成浏览器的重复进行重绘、回流、painting等过程。

声明：以上都是自己爬坑爬出来的，读了elementplus的issue才得以解决。如有不妥地方，还请指出。