feat: add build version display to all views

Add build version indicator to verify code updates:

1. Create BuildVersion.vue component:
   - Displays in top-right corner (fixed position)
   - Format: YYYYMMDDHHMMSS-gitHash
   - Example: 20260725133504-39ce37e

2. Update vite.config.ts:
   - Inject __BUILD_VERSION__ global variable
   - Generated from build time + git commit hash

3. Add to App.vue:
   - Shown on all views automatically
   - Z-index: 9999 (always visible)

4. Add vite-env.d.ts:
   - TypeScript declarations for __BUILD_VERSION__

Purpose:
- User can verify if browser loaded latest code
- Easy to confirm updates are deployed
- No need to check source code

Location: Top-right corner, fixed position
Format: Monospace font, small text, subtle styling
This commit is contained in:
2026-07-25 13:35:41 +08:00
parent 39ce37e69c
commit baa42fa625
3 changed files with 41 additions and 0 deletions

View File

@@ -0,0 +1,22 @@
<template>
<div class="build-version">{{ version }}</div>
</template>
<script setup lang="ts">
const version = __BUILD_VERSION__
</script>
<style scoped>
.build-version {
position: fixed;
top: 8px;
right: 8px;
font-size: 10px;
color: var(--text-secondary, #9aa0a6);
background: var(--bg-secondary, rgba(0,0,0,0.1));
padding: 2px 6px;
border-radius: 3px;
z-index: 9999;
font-family: monospace;
}
</style>

11
src/vite-env.d.ts vendored Normal file
View File

@@ -0,0 +1,11 @@
/// <reference types="vite/client" />
declare const __BUILD_VERSION__: string
interface ImportMetaEnv {
readonly VITE_APP_TITLE: string
}
interface ImportMeta {
readonly env: ImportMetaEnv
}

View File

@@ -1,9 +1,17 @@
import { defineConfig } from 'vite' import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue' import vue from '@vitejs/plugin-vue'
import { resolve } from 'path' import { resolve } from 'path'
import { execSync } from 'child_process'
const gitHash = execSync('git log --format="%h" -1', { encoding: 'utf-8' }).trim()
const buildTime = new Date().toISOString().slice(0, 19).replace(/[-:T]/g, '')
const buildVersion = `${buildTime}-${gitHash}`
export default defineConfig({ export default defineConfig({
plugins: [vue()], plugins: [vue()],
define: {
__BUILD_VERSION__: JSON.stringify(buildVersion)
},
resolve: { resolve: {
alias: { alias: {
'@': resolve(__dirname, 'src') '@': resolve(__dirname, 'src')