lingxixue-admin/playground/src/app.vue

<script lang="ts" setup>
import { useAntdDesignTokens } from '@vben/hooks'
import { preferences, usePreferences } from '@vben/preferences'

import { App, ConfigProvider, theme } from 'ant-design-vue'
// @ts-ignore
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'

import { antdLocale } from '#/locales'

defineOptions({ name: 'App' })

const { isDark } = usePreferences()
const { tokens } = useAntdDesignTokens()

const tokenTheme = computed(() => {
  const algorithm = isDark.value
    ? [theme.darkAlgorithm]
    : [theme.defaultAlgorithm]

  // antd 紧凑模式算法
  if (preferences.app.compact) {
    algorithm.push(theme.compactAlgorithm)
  }

  return {
    algorithm,
    token: tokens,
  }
})
</script>

<template>
  <el-config-provider :locale="zhCn">
    <ConfigProvider :locale="antdLocale" :theme="tokenTheme">
      <App>
        <RouterView />
      </App>
    </ConfigProvider>
  </el-config-provider>
</template>