feat: enhance project configuration and add new features

2025-09-09 18:19:23 +08:00
parent 88483c26e6
commit 4851b83c37
28 changed files with 4323 additions and 37 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -36,3 +36,7 @@ playwright-report/
 !.dev.vars.example
 # .env*
 # !.env.example
+
+
+# Generated
+components.d.ts
--- a/auto-imports.d.ts
+++ b/auto-imports.d.ts
@@ -0,0 +1,659 @@
+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// noinspection JSUnusedGlobalSymbols
+// Generated by unplugin-auto-import
+// biome-ignore lint: disable
+export {}
+declare global {
+  const EffectScope: typeof import('vue')['EffectScope']
+  const acceptHMRUpdate: typeof import('pinia')['acceptHMRUpdate']
+  const arrayToTree: typeof import('utils4u/array')['arrayToTree']
+  const asyncComputed: typeof import('@vueuse/core')['asyncComputed']
+  const autoResetRef: typeof import('@vueuse/core')['autoResetRef']
+  const computed: typeof import('vue')['computed']
+  const computedAsync: typeof import('@vueuse/core')['computedAsync']
+  const computedEager: typeof import('@vueuse/core')['computedEager']
+  const computedInject: typeof import('@vueuse/core')['computedInject']
+  const computedWithControl: typeof import('@vueuse/core')['computedWithControl']
+  const consola: typeof import('consola/browser')['consola']
+  const controlledComputed: typeof import('@vueuse/core')['controlledComputed']
+  const controlledRef: typeof import('@vueuse/core')['controlledRef']
+  const convertFileToBase64: typeof import('utils4u/browser')['convertFileToBase64']
+  const createApp: typeof import('vue')['createApp']
+  const createEventHook: typeof import('@vueuse/core')['createEventHook']
+  const createGlobalState: typeof import('@vueuse/core')['createGlobalState']
+  const createInjectionState: typeof import('@vueuse/core')['createInjectionState']
+  const createLogGuard: typeof import('utils4u/vue-router')['createLogGuard']
+  const createNProgressGuard: typeof import('utils4u/vue-router')['createNProgressGuard']
+  const createPinia: typeof import('pinia')['createPinia']
+  const createReactiveFn: typeof import('@vueuse/core')['createReactiveFn']
+  const createRef: typeof import('@vueuse/core')['createRef']
+  const createReusableTemplate: typeof import('@vueuse/core')['createReusableTemplate']
+  const createSharedComposable: typeof import('@vueuse/core')['createSharedComposable']
+  const createStackGuard: typeof import('utils4u/vue-router')['createStackGuard']
+  const createTemplatePromise: typeof import('@vueuse/core')['createTemplatePromise']
+  const createUnrefFn: typeof import('@vueuse/core')['createUnrefFn']
+  const customRef: typeof import('vue')['customRef']
+  const debouncedRef: typeof import('@vueuse/core')['debouncedRef']
+  const debouncedWatch: typeof import('@vueuse/core')['debouncedWatch']
+  const deepFreeze: typeof import('deep-freeze-es6')['default']
+  const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
+  const defineComponent: typeof import('vue')['defineComponent']
+  const defineStore: typeof import('pinia')['defineStore']
+  const eagerComputed: typeof import('@vueuse/core')['eagerComputed']
+  const effectScope: typeof import('vue')['effectScope']
+  const extendRef: typeof import('@vueuse/core')['extendRef']
+  const getActivePinia: typeof import('pinia')['getActivePinia']
+  const getCurrentInstance: typeof import('vue')['getCurrentInstance']
+  const getCurrentScope: typeof import('vue')['getCurrentScope']
+  const getCurrentWatcher: typeof import('vue')['getCurrentWatcher']
+  const h: typeof import('vue')['h']
+  const ignorableWatch: typeof import('@vueuse/core')['ignorableWatch']
+  const inject: typeof import('vue')['inject']
+  const injectLocal: typeof import('@vueuse/core')['injectLocal']
+  const isDefined: typeof import('@vueuse/core')['isDefined']
+  const isProxy: typeof import('vue')['isProxy']
+  const isReactive: typeof import('vue')['isReactive']
+  const isReadonly: typeof import('vue')['isReadonly']
+  const isRef: typeof import('vue')['isRef']
+  const isShallow: typeof import('vue')['isShallow']
+  const makeDestructurable: typeof import('@vueuse/core')['makeDestructurable']
+  const mapActions: typeof import('pinia')['mapActions']
+  const mapGetters: typeof import('pinia')['mapGetters']
+  const mapState: typeof import('pinia')['mapState']
+  const mapStores: typeof import('pinia')['mapStores']
+  const mapWritableState: typeof import('pinia')['mapWritableState']
+  const markRaw: typeof import('vue')['markRaw']
+  const nextTick: typeof import('vue')['nextTick']
+  const onActivated: typeof import('vue')['onActivated']
+  const onBeforeMount: typeof import('vue')['onBeforeMount']
+  const onBeforeRouteLeave: typeof import('vue-router')['onBeforeRouteLeave']
+  const onBeforeRouteUpdate: typeof import('vue-router')['onBeforeRouteUpdate']
+  const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
+  const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
+  const onClickOutside: typeof import('@vueuse/core')['onClickOutside']
+  const onDeactivated: typeof import('vue')['onDeactivated']
+  const onElementRemoval: typeof import('@vueuse/core')['onElementRemoval']
+  const onErrorCaptured: typeof import('vue')['onErrorCaptured']
+  const onKeyStroke: typeof import('@vueuse/core')['onKeyStroke']
+  const onLongPress: typeof import('@vueuse/core')['onLongPress']
+  const onMounted: typeof import('vue')['onMounted']
+  const onRenderTracked: typeof import('vue')['onRenderTracked']
+  const onRenderTriggered: typeof import('vue')['onRenderTriggered']
+  const onScopeDispose: typeof import('vue')['onScopeDispose']
+  const onServerPrefetch: typeof import('vue')['onServerPrefetch']
+  const onStartTyping: typeof import('@vueuse/core')['onStartTyping']
+  const onUnmounted: typeof import('vue')['onUnmounted']
+  const onUpdated: typeof import('vue')['onUpdated']
+  const onWatcherCleanup: typeof import('vue')['onWatcherCleanup']
+  const pausableWatch: typeof import('@vueuse/core')['pausableWatch']
+  const provide: typeof import('vue')['provide']
+  const provideLocal: typeof import('@vueuse/core')['provideLocal']
+  const reactify: typeof import('@vueuse/core')['reactify']
+  const reactifyObject: typeof import('@vueuse/core')['reactifyObject']
+  const reactive: typeof import('vue')['reactive']
+  const reactiveComputed: typeof import('@vueuse/core')['reactiveComputed']
+  const reactiveOmit: typeof import('@vueuse/core')['reactiveOmit']
+  const reactivePick: typeof import('@vueuse/core')['reactivePick']
+  const readonly: typeof import('vue')['readonly']
+  const ref: typeof import('vue')['ref']
+  const refAutoReset: typeof import('@vueuse/core')['refAutoReset']
+  const refDebounced: typeof import('@vueuse/core')['refDebounced']
+  const refDefault: typeof import('@vueuse/core')['refDefault']
+  const refThrottled: typeof import('@vueuse/core')['refThrottled']
+  const refWithControl: typeof import('@vueuse/core')['refWithControl']
+  const resolveComponent: typeof import('vue')['resolveComponent']
+  const resolveRef: typeof import('@vueuse/core')['resolveRef']
+  const resolveUnref: typeof import('@vueuse/core')['resolveUnref']
+  const setActivePinia: typeof import('pinia')['setActivePinia']
+  const setMapStoreSuffix: typeof import('pinia')['setMapStoreSuffix']
+  const setViewportCSSVars: typeof import('utils4u/browser')['setViewportCSSVars']
+  const shallowReactive: typeof import('vue')['shallowReactive']
+  const shallowReadonly: typeof import('vue')['shallowReadonly']
+  const shallowRef: typeof import('vue')['shallowRef']
+  const showOpenFilePicker: typeof import('utils4u/browser')['showOpenFilePicker']
+  const storeToRefs: typeof import('pinia')['storeToRefs']
+  const syncRef: typeof import('@vueuse/core')['syncRef']
+  const syncRefs: typeof import('@vueuse/core')['syncRefs']
+  const templateRef: typeof import('@vueuse/core')['templateRef']
+  const throttledRef: typeof import('@vueuse/core')['throttledRef']
+  const throttledWatch: typeof import('@vueuse/core')['throttledWatch']
+  const toRaw: typeof import('vue')['toRaw']
+  const toReactive: typeof import('@vueuse/core')['toReactive']
+  const toRef: typeof import('vue')['toRef']
+  const toRefs: typeof import('vue')['toRefs']
+  const toValue: typeof import('vue')['toValue']
+  const triggerRef: typeof import('vue')['triggerRef']
+  const tryOnBeforeMount: typeof import('@vueuse/core')['tryOnBeforeMount']
+  const tryOnBeforeUnmount: typeof import('@vueuse/core')['tryOnBeforeUnmount']
+  const tryOnMounted: typeof import('@vueuse/core')['tryOnMounted']
+  const tryOnScopeDispose: typeof import('@vueuse/core')['tryOnScopeDispose']
+  const tryOnUnmounted: typeof import('@vueuse/core')['tryOnUnmounted']
+  const unref: typeof import('vue')['unref']
+  const unrefElement: typeof import('@vueuse/core')['unrefElement']
+  const until: typeof import('@vueuse/core')['until']
+  const useActiveElement: typeof import('@vueuse/core')['useActiveElement']
+  const useAnimate: typeof import('@vueuse/core')['useAnimate']
+  const useArrayDifference: typeof import('@vueuse/core')['useArrayDifference']
+  const useArrayEvery: typeof import('@vueuse/core')['useArrayEvery']
+  const useArrayFilter: typeof import('@vueuse/core')['useArrayFilter']
+  const useArrayFind: typeof import('@vueuse/core')['useArrayFind']
+  const useArrayFindIndex: typeof import('@vueuse/core')['useArrayFindIndex']
+  const useArrayFindLast: typeof import('@vueuse/core')['useArrayFindLast']
+  const useArrayIncludes: typeof import('@vueuse/core')['useArrayIncludes']
+  const useArrayJoin: typeof import('@vueuse/core')['useArrayJoin']
+  const useArrayMap: typeof import('@vueuse/core')['useArrayMap']
+  const useArrayReduce: typeof import('@vueuse/core')['useArrayReduce']
+  const useArraySome: typeof import('@vueuse/core')['useArraySome']
+  const useArrayUnique: typeof import('@vueuse/core')['useArrayUnique']
+  const useAsyncQueue: typeof import('@vueuse/core')['useAsyncQueue']
+  const useAsyncState: typeof import('@vueuse/core')['useAsyncState']
+  const useAttrs: typeof import('vue')['useAttrs']
+  const useBase64: typeof import('@vueuse/core')['useBase64']
+  const useBattery: typeof import('@vueuse/core')['useBattery']
+  const useBluetooth: typeof import('@vueuse/core')['useBluetooth']
+  const useBreakpoints: typeof import('@vueuse/core')['useBreakpoints']
+  const useBroadcastChannel: typeof import('@vueuse/core')['useBroadcastChannel']
+  const useBrowserLocation: typeof import('@vueuse/core')['useBrowserLocation']
+  const useCached: typeof import('@vueuse/core')['useCached']
+  const useClipboard: typeof import('@vueuse/core')['useClipboard']
+  const useClipboardItems: typeof import('@vueuse/core')['useClipboardItems']
+  const useCloned: typeof import('@vueuse/core')['useCloned']
+  const useColorMode: typeof import('@vueuse/core')['useColorMode']
+  const useConfirmDialog: typeof import('@vueuse/core')['useConfirmDialog']
+  const useCountdown: typeof import('@vueuse/core')['useCountdown']
+  const useCounter: typeof import('@vueuse/core')['useCounter']
+  const useCssModule: typeof import('vue')['useCssModule']
+  const useCssVar: typeof import('@vueuse/core')['useCssVar']
+  const useCssVars: typeof import('vue')['useCssVars']
+  const useCurrentElement: typeof import('@vueuse/core')['useCurrentElement']
+  const useCycleList: typeof import('@vueuse/core')['useCycleList']
+  const useDark: typeof import('@vueuse/core')['useDark']
+  const useDateFormat: typeof import('@vueuse/core')['useDateFormat']
+  const useDebounce: typeof import('@vueuse/core')['useDebounce']
+  const useDebounceFn: typeof import('@vueuse/core')['useDebounceFn']
+  const useDebouncedRefHistory: typeof import('@vueuse/core')['useDebouncedRefHistory']
+  const useDeviceMotion: typeof import('@vueuse/core')['useDeviceMotion']
+  const useDeviceOrientation: typeof import('@vueuse/core')['useDeviceOrientation']
+  const useDevicePixelRatio: typeof import('@vueuse/core')['useDevicePixelRatio']
+  const useDevicesList: typeof import('@vueuse/core')['useDevicesList']
+  const useDialog: typeof import('naive-ui')['useDialog']
+  const useDisplayMedia: typeof import('@vueuse/core')['useDisplayMedia']
+  const useDocumentVisibility: typeof import('@vueuse/core')['useDocumentVisibility']
+  const useDraggable: typeof import('@vueuse/core')['useDraggable']
+  const useDropZone: typeof import('@vueuse/core')['useDropZone']
+  const useElementBounding: typeof import('@vueuse/core')['useElementBounding']
+  const useElementByPoint: typeof import('@vueuse/core')['useElementByPoint']
+  const useElementHover: typeof import('@vueuse/core')['useElementHover']
+  const useElementSize: typeof import('@vueuse/core')['useElementSize']
+  const useElementVisibility: typeof import('@vueuse/core')['useElementVisibility']
+  const useEventBus: typeof import('@vueuse/core')['useEventBus']
+  const useEventListener: typeof import('@vueuse/core')['useEventListener']
+  const useEventSource: typeof import('@vueuse/core')['useEventSource']
+  const useEyeDropper: typeof import('@vueuse/core')['useEyeDropper']
+  const useFavicon: typeof import('@vueuse/core')['useFavicon']
+  const useFetch: typeof import('@vueuse/core')['useFetch']
+  const useFileDialog: typeof import('@vueuse/core')['useFileDialog']
+  const useFileSystemAccess: typeof import('@vueuse/core')['useFileSystemAccess']
+  const useFocus: typeof import('@vueuse/core')['useFocus']
+  const useFocusWithin: typeof import('@vueuse/core')['useFocusWithin']
+  const useFps: typeof import('@vueuse/core')['useFps']
+  const useFullscreen: typeof import('@vueuse/core')['useFullscreen']
+  const useGamepad: typeof import('@vueuse/core')['useGamepad']
+  const useGeolocation: typeof import('@vueuse/core')['useGeolocation']
+  const useI18n: typeof import('vue-i18n')['useI18n']
+  const useId: typeof import('vue')['useId']
+  const useIdle: typeof import('@vueuse/core')['useIdle']
+  const useImage: typeof import('@vueuse/core')['useImage']
+  const useInfiniteScroll: typeof import('@vueuse/core')['useInfiniteScroll']
+  const useIntersectionObserver: typeof import('@vueuse/core')['useIntersectionObserver']
+  const useInterval: typeof import('@vueuse/core')['useInterval']
+  const useIntervalFn: typeof import('@vueuse/core')['useIntervalFn']
+  const useKeyModifier: typeof import('@vueuse/core')['useKeyModifier']
+  const useLastChanged: typeof import('@vueuse/core')['useLastChanged']
+  const useLink: typeof import('vue-router/auto')['useLink']
+  const useLoadingBar: typeof import('naive-ui')['useLoadingBar']
+  const useLocalStorage: typeof import('@vueuse/core')['useLocalStorage']
+  const useMagicKeys: typeof import('@vueuse/core')['useMagicKeys']
+  const useManualRefHistory: typeof import('@vueuse/core')['useManualRefHistory']
+  const useMediaControls: typeof import('@vueuse/core')['useMediaControls']
+  const useMediaQuery: typeof import('@vueuse/core')['useMediaQuery']
+  const useMemoize: typeof import('@vueuse/core')['useMemoize']
+  const useMemory: typeof import('@vueuse/core')['useMemory']
+  const useMessage: typeof import('naive-ui')['useMessage']
+  const useModal: typeof import('naive-ui')['useModal']
+  const useModel: typeof import('vue')['useModel']
+  const useMounted: typeof import('@vueuse/core')['useMounted']
+  const useMouse: typeof import('@vueuse/core')['useMouse']
+  const useMouseInElement: typeof import('@vueuse/core')['useMouseInElement']
+  const useMousePressed: typeof import('@vueuse/core')['useMousePressed']
+  const useMutationObserver: typeof import('@vueuse/core')['useMutationObserver']
+  const useNavigatorLanguage: typeof import('@vueuse/core')['useNavigatorLanguage']
+  const useNetwork: typeof import('@vueuse/core')['useNetwork']
+  const useNotification: typeof import('naive-ui')['useNotification']
+  const useNow: typeof import('@vueuse/core')['useNow']
+  const useObjectUrl: typeof import('@vueuse/core')['useObjectUrl']
+  const useOffsetPagination: typeof import('@vueuse/core')['useOffsetPagination']
+  const useOnline: typeof import('@vueuse/core')['useOnline']
+  const usePageLeave: typeof import('@vueuse/core')['usePageLeave']
+  const useParallax: typeof import('@vueuse/core')['useParallax']
+  const useParentElement: typeof import('@vueuse/core')['useParentElement']
+  const usePerformanceObserver: typeof import('@vueuse/core')['usePerformanceObserver']
+  const usePermission: typeof import('@vueuse/core')['usePermission']
+  const usePointer: typeof import('@vueuse/core')['usePointer']
+  const usePointerLock: typeof import('@vueuse/core')['usePointerLock']
+  const usePointerSwipe: typeof import('@vueuse/core')['usePointerSwipe']
+  const usePreferredColorScheme: typeof import('@vueuse/core')['usePreferredColorScheme']
+  const usePreferredContrast: typeof import('@vueuse/core')['usePreferredContrast']
+  const usePreferredDark: typeof import('@vueuse/core')['usePreferredDark']
+  const usePreferredLanguages: typeof import('@vueuse/core')['usePreferredLanguages']
+  const usePreferredReducedMotion: typeof import('@vueuse/core')['usePreferredReducedMotion']
+  const usePreferredReducedTransparency: typeof import('@vueuse/core')['usePreferredReducedTransparency']
+  const usePrevious: typeof import('@vueuse/core')['usePrevious']
+  const useRafFn: typeof import('@vueuse/core')['useRafFn']
+  const useRefHistory: typeof import('@vueuse/core')['useRefHistory']
+  const useRefs: typeof import('utils4u/vue-use')['useRefs']
+  const useResizeObserver: typeof import('@vueuse/core')['useResizeObserver']
+  const useRoute: typeof import('vue-router')['useRoute']
+  const useRouter: typeof import('vue-router')['useRouter']
+  const useSSRWidth: typeof import('@vueuse/core')['useSSRWidth']
+  const useScreenOrientation: typeof import('@vueuse/core')['useScreenOrientation']
+  const useScreenSafeArea: typeof import('@vueuse/core')['useScreenSafeArea']
+  const useScriptTag: typeof import('@vueuse/core')['useScriptTag']
+  const useScroll: typeof import('@vueuse/core')['useScroll']
+  const useScrollLock: typeof import('@vueuse/core')['useScrollLock']
+  const useSessionStorage: typeof import('@vueuse/core')['useSessionStorage']
+  const useShare: typeof import('@vueuse/core')['useShare']
+  const useSlots: typeof import('vue')['useSlots']
+  const useSorted: typeof import('@vueuse/core')['useSorted']
+  const useSpeechRecognition: typeof import('@vueuse/core')['useSpeechRecognition']
+  const useSpeechSynthesis: typeof import('@vueuse/core')['useSpeechSynthesis']
+  const useStepper: typeof import('@vueuse/core')['useStepper']
+  const useStorage: typeof import('@vueuse/core')['useStorage']
+  const useStorageAsync: typeof import('@vueuse/core')['useStorageAsync']
+  const useStyleTag: typeof import('@vueuse/core')['useStyleTag']
+  const useSupported: typeof import('@vueuse/core')['useSupported']
+  const useSwipe: typeof import('@vueuse/core')['useSwipe']
+  const useTemplateRef: typeof import('vue')['useTemplateRef']
+  const useTemplateRefsList: typeof import('@vueuse/core')['useTemplateRefsList']
+  const useTextDirection: typeof import('@vueuse/core')['useTextDirection']
+  const useTextSelection: typeof import('@vueuse/core')['useTextSelection']
+  const useTextareaAutosize: typeof import('@vueuse/core')['useTextareaAutosize']
+  const useThrottle: typeof import('@vueuse/core')['useThrottle']
+  const useThrottleFn: typeof import('@vueuse/core')['useThrottleFn']
+  const useThrottledRefHistory: typeof import('@vueuse/core')['useThrottledRefHistory']
+  const useTimeAgo: typeof import('@vueuse/core')['useTimeAgo']
+  const useTimeAgoIntl: typeof import('@vueuse/core')['useTimeAgoIntl']
+  const useTimeout: typeof import('@vueuse/core')['useTimeout']
+  const useTimeoutFn: typeof import('@vueuse/core')['useTimeoutFn']
+  const useTimeoutPoll: typeof import('@vueuse/core')['useTimeoutPoll']
+  const useTimestamp: typeof import('@vueuse/core')['useTimestamp']
+  const useTitle: typeof import('@vueuse/core')['useTitle']
+  const useToNumber: typeof import('@vueuse/core')['useToNumber']
+  const useToString: typeof import('@vueuse/core')['useToString']
+  const useToggle: typeof import('@vueuse/core')['useToggle']
+  const useTransition: typeof import('@vueuse/core')['useTransition']
+  const useUrlSearchParams: typeof import('@vueuse/core')['useUrlSearchParams']
+  const useUserMedia: typeof import('@vueuse/core')['useUserMedia']
+  const useVModel: typeof import('@vueuse/core')['useVModel']
+  const useVModels: typeof import('@vueuse/core')['useVModels']
+  const useVibrate: typeof import('@vueuse/core')['useVibrate']
+  const useVirtualList: typeof import('@vueuse/core')['useVirtualList']
+  const useWakeLock: typeof import('@vueuse/core')['useWakeLock']
+  const useWebNotification: typeof import('@vueuse/core')['useWebNotification']
+  const useWebSocket: typeof import('@vueuse/core')['useWebSocket']
+  const useWebWorker: typeof import('@vueuse/core')['useWebWorker']
+  const useWebWorkerFn: typeof import('@vueuse/core')['useWebWorkerFn']
+  const useWindowFocus: typeof import('@vueuse/core')['useWindowFocus']
+  const useWindowScroll: typeof import('@vueuse/core')['useWindowScroll']
+  const useWindowSize: typeof import('@vueuse/core')['useWindowSize']
+  const watch: typeof import('vue')['watch']
+  const watchArray: typeof import('@vueuse/core')['watchArray']
+  const watchAtMost: typeof import('@vueuse/core')['watchAtMost']
+  const watchDebounced: typeof import('@vueuse/core')['watchDebounced']
+  const watchDeep: typeof import('@vueuse/core')['watchDeep']
+  const watchEffect: typeof import('vue')['watchEffect']
+  const watchIgnorable: typeof import('@vueuse/core')['watchIgnorable']
+  const watchImmediate: typeof import('@vueuse/core')['watchImmediate']
+  const watchOnce: typeof import('@vueuse/core')['watchOnce']
+  const watchPausable: typeof import('@vueuse/core')['watchPausable']
+  const watchPostEffect: typeof import('vue')['watchPostEffect']
+  const watchSyncEffect: typeof import('vue')['watchSyncEffect']
+  const watchThrottled: typeof import('@vueuse/core')['watchThrottled']
+  const watchTriggerable: typeof import('@vueuse/core')['watchTriggerable']
+  const watchWithFilter: typeof import('@vueuse/core')['watchWithFilter']
+  const whenever: typeof import('@vueuse/core')['whenever']
+}
+// for type re-export
+declare global {
+  // @ts-ignore
+  export type { Component, Slot, Slots, ComponentPublicInstance, ComputedRef, DirectiveBinding, ExtractDefaultPropTypes, ExtractPropTypes, ExtractPublicPropTypes, InjectionKey, PropType, Ref, ShallowRef, MaybeRef, MaybeRefOrGetter, VNode, WritableComputedRef } from 'vue'
+  import('vue')
+}
+
+// for vue template auto import
+import { UnwrapRef } from 'vue'
+declare module 'vue' {
+  interface GlobalComponents {}
+  interface ComponentCustomProperties {
+    readonly EffectScope: UnwrapRef<typeof import('vue')['EffectScope']>
+    readonly acceptHMRUpdate: UnwrapRef<typeof import('pinia')['acceptHMRUpdate']>
+    readonly arrayToTree: UnwrapRef<typeof import('utils4u/array')['arrayToTree']>
+    readonly asyncComputed: UnwrapRef<typeof import('@vueuse/core')['asyncComputed']>
+    readonly autoResetRef: UnwrapRef<typeof import('@vueuse/core')['autoResetRef']>
+    readonly computed: UnwrapRef<typeof import('vue')['computed']>
+    readonly computedAsync: UnwrapRef<typeof import('@vueuse/core')['computedAsync']>
+    readonly computedEager: UnwrapRef<typeof import('@vueuse/core')['computedEager']>
+    readonly computedInject: UnwrapRef<typeof import('@vueuse/core')['computedInject']>
+    readonly computedWithControl: UnwrapRef<typeof import('@vueuse/core')['computedWithControl']>
+    readonly consola: UnwrapRef<typeof import('consola/browser')['consola']>
+    readonly controlledComputed: UnwrapRef<typeof import('@vueuse/core')['controlledComputed']>
+    readonly controlledRef: UnwrapRef<typeof import('@vueuse/core')['controlledRef']>
+    readonly convertFileToBase64: UnwrapRef<typeof import('utils4u/browser')['convertFileToBase64']>
+    readonly createApp: UnwrapRef<typeof import('vue')['createApp']>
+    readonly createEventHook: UnwrapRef<typeof import('@vueuse/core')['createEventHook']>
+    readonly createGlobalState: UnwrapRef<typeof import('@vueuse/core')['createGlobalState']>
+    readonly createInjectionState: UnwrapRef<typeof import('@vueuse/core')['createInjectionState']>
+    readonly createLogGuard: UnwrapRef<typeof import('utils4u/vue-router')['createLogGuard']>
+    readonly createNProgressGuard: UnwrapRef<typeof import('utils4u/vue-router')['createNProgressGuard']>
+    readonly createPinia: UnwrapRef<typeof import('pinia')['createPinia']>
+    readonly createReactiveFn: UnwrapRef<typeof import('@vueuse/core')['createReactiveFn']>
+    readonly createRef: UnwrapRef<typeof import('@vueuse/core')['createRef']>
+    readonly createReusableTemplate: UnwrapRef<typeof import('@vueuse/core')['createReusableTemplate']>
+    readonly createSharedComposable: UnwrapRef<typeof import('@vueuse/core')['createSharedComposable']>
+    readonly createStackGuard: UnwrapRef<typeof import('utils4u/vue-router')['createStackGuard']>
+    readonly createTemplatePromise: UnwrapRef<typeof import('@vueuse/core')['createTemplatePromise']>
+    readonly createUnrefFn: UnwrapRef<typeof import('@vueuse/core')['createUnrefFn']>
+    readonly customRef: UnwrapRef<typeof import('vue')['customRef']>
+    readonly debouncedRef: UnwrapRef<typeof import('@vueuse/core')['debouncedRef']>
+    readonly debouncedWatch: UnwrapRef<typeof import('@vueuse/core')['debouncedWatch']>
+    readonly deepFreeze: UnwrapRef<typeof import('deep-freeze-es6')['default']>
+    readonly defineAsyncComponent: UnwrapRef<typeof import('vue')['defineAsyncComponent']>
+    readonly defineComponent: UnwrapRef<typeof import('vue')['defineComponent']>
+    readonly defineStore: UnwrapRef<typeof import('pinia')['defineStore']>
+    readonly eagerComputed: UnwrapRef<typeof import('@vueuse/core')['eagerComputed']>
+    readonly effectScope: UnwrapRef<typeof import('vue')['effectScope']>
+    readonly extendRef: UnwrapRef<typeof import('@vueuse/core')['extendRef']>
+    readonly getActivePinia: UnwrapRef<typeof import('pinia')['getActivePinia']>
+    readonly getCurrentInstance: UnwrapRef<typeof import('vue')['getCurrentInstance']>
+    readonly getCurrentScope: UnwrapRef<typeof import('vue')['getCurrentScope']>
+    readonly getCurrentWatcher: UnwrapRef<typeof import('vue')['getCurrentWatcher']>
+    readonly h: UnwrapRef<typeof import('vue')['h']>
+    readonly ignorableWatch: UnwrapRef<typeof import('@vueuse/core')['ignorableWatch']>
+    readonly inject: UnwrapRef<typeof import('vue')['inject']>
+    readonly injectLocal: UnwrapRef<typeof import('@vueuse/core')['injectLocal']>
+    readonly isDefined: UnwrapRef<typeof import('@vueuse/core')['isDefined']>
+    readonly isProxy: UnwrapRef<typeof import('vue')['isProxy']>
+    readonly isReactive: UnwrapRef<typeof import('vue')['isReactive']>
+    readonly isReadonly: UnwrapRef<typeof import('vue')['isReadonly']>
+    readonly isRef: UnwrapRef<typeof import('vue')['isRef']>
+    readonly isShallow: UnwrapRef<typeof import('vue')['isShallow']>
+    readonly makeDestructurable: UnwrapRef<typeof import('@vueuse/core')['makeDestructurable']>
+    readonly mapActions: UnwrapRef<typeof import('pinia')['mapActions']>
+    readonly mapGetters: UnwrapRef<typeof import('pinia')['mapGetters']>
+    readonly mapState: UnwrapRef<typeof import('pinia')['mapState']>
+    readonly mapStores: UnwrapRef<typeof import('pinia')['mapStores']>
+    readonly mapWritableState: UnwrapRef<typeof import('pinia')['mapWritableState']>
+    readonly markRaw: UnwrapRef<typeof import('vue')['markRaw']>
+    readonly nextTick: UnwrapRef<typeof import('vue')['nextTick']>
+    readonly onActivated: UnwrapRef<typeof import('vue')['onActivated']>
+    readonly onBeforeMount: UnwrapRef<typeof import('vue')['onBeforeMount']>
+    readonly onBeforeRouteLeave: UnwrapRef<typeof import('vue-router')['onBeforeRouteLeave']>
+    readonly onBeforeRouteUpdate: UnwrapRef<typeof import('vue-router')['onBeforeRouteUpdate']>
+    readonly onBeforeUnmount: UnwrapRef<typeof import('vue')['onBeforeUnmount']>
+    readonly onBeforeUpdate: UnwrapRef<typeof import('vue')['onBeforeUpdate']>
+    readonly onClickOutside: UnwrapRef<typeof import('@vueuse/core')['onClickOutside']>
+    readonly onDeactivated: UnwrapRef<typeof import('vue')['onDeactivated']>
+    readonly onElementRemoval: UnwrapRef<typeof import('@vueuse/core')['onElementRemoval']>
+    readonly onErrorCaptured: UnwrapRef<typeof import('vue')['onErrorCaptured']>
+    readonly onKeyStroke: UnwrapRef<typeof import('@vueuse/core')['onKeyStroke']>
+    readonly onLongPress: UnwrapRef<typeof import('@vueuse/core')['onLongPress']>
+    readonly onMounted: UnwrapRef<typeof import('vue')['onMounted']>
+    readonly onRenderTracked: UnwrapRef<typeof import('vue')['onRenderTracked']>
+    readonly onRenderTriggered: UnwrapRef<typeof import('vue')['onRenderTriggered']>
+    readonly onScopeDispose: UnwrapRef<typeof import('vue')['onScopeDispose']>
+    readonly onServerPrefetch: UnwrapRef<typeof import('vue')['onServerPrefetch']>
+    readonly onStartTyping: UnwrapRef<typeof import('@vueuse/core')['onStartTyping']>
+    readonly onUnmounted: UnwrapRef<typeof import('vue')['onUnmounted']>
+    readonly onUpdated: UnwrapRef<typeof import('vue')['onUpdated']>
+    readonly onWatcherCleanup: UnwrapRef<typeof import('vue')['onWatcherCleanup']>
+    readonly pausableWatch: UnwrapRef<typeof import('@vueuse/core')['pausableWatch']>
+    readonly provide: UnwrapRef<typeof import('vue')['provide']>
+    readonly provideLocal: UnwrapRef<typeof import('@vueuse/core')['provideLocal']>
+    readonly reactify: UnwrapRef<typeof import('@vueuse/core')['reactify']>
+    readonly reactifyObject: UnwrapRef<typeof import('@vueuse/core')['reactifyObject']>
+    readonly reactive: UnwrapRef<typeof import('vue')['reactive']>
+    readonly reactiveComputed: UnwrapRef<typeof import('@vueuse/core')['reactiveComputed']>
+    readonly reactiveOmit: UnwrapRef<typeof import('@vueuse/core')['reactiveOmit']>
+    readonly reactivePick: UnwrapRef<typeof import('@vueuse/core')['reactivePick']>
+    readonly readonly: UnwrapRef<typeof import('vue')['readonly']>
+    readonly ref: UnwrapRef<typeof import('vue')['ref']>
+    readonly refAutoReset: UnwrapRef<typeof import('@vueuse/core')['refAutoReset']>
+    readonly refDebounced: UnwrapRef<typeof import('@vueuse/core')['refDebounced']>
+    readonly refDefault: UnwrapRef<typeof import('@vueuse/core')['refDefault']>
+    readonly refThrottled: UnwrapRef<typeof import('@vueuse/core')['refThrottled']>
+    readonly refWithControl: UnwrapRef<typeof import('@vueuse/core')['refWithControl']>
+    readonly resolveComponent: UnwrapRef<typeof import('vue')['resolveComponent']>
+    readonly resolveRef: UnwrapRef<typeof import('@vueuse/core')['resolveRef']>
+    readonly resolveUnref: UnwrapRef<typeof import('@vueuse/core')['resolveUnref']>
+    readonly setActivePinia: UnwrapRef<typeof import('pinia')['setActivePinia']>
+    readonly setMapStoreSuffix: UnwrapRef<typeof import('pinia')['setMapStoreSuffix']>
+    readonly setViewportCSSVars: UnwrapRef<typeof import('utils4u/browser')['setViewportCSSVars']>
+    readonly shallowReactive: UnwrapRef<typeof import('vue')['shallowReactive']>
+    readonly shallowReadonly: UnwrapRef<typeof import('vue')['shallowReadonly']>
+    readonly shallowRef: UnwrapRef<typeof import('vue')['shallowRef']>
+    readonly showOpenFilePicker: UnwrapRef<typeof import('utils4u/browser')['showOpenFilePicker']>
+    readonly storeToRefs: UnwrapRef<typeof import('pinia')['storeToRefs']>
+    readonly syncRef: UnwrapRef<typeof import('@vueuse/core')['syncRef']>
+    readonly syncRefs: UnwrapRef<typeof import('@vueuse/core')['syncRefs']>
+    readonly templateRef: UnwrapRef<typeof import('@vueuse/core')['templateRef']>
+    readonly throttledRef: UnwrapRef<typeof import('@vueuse/core')['throttledRef']>
+    readonly throttledWatch: UnwrapRef<typeof import('@vueuse/core')['throttledWatch']>
+    readonly toRaw: UnwrapRef<typeof import('vue')['toRaw']>
+    readonly toReactive: UnwrapRef<typeof import('@vueuse/core')['toReactive']>
+    readonly toRef: UnwrapRef<typeof import('vue')['toRef']>
+    readonly toRefs: UnwrapRef<typeof import('vue')['toRefs']>
+    readonly toValue: UnwrapRef<typeof import('vue')['toValue']>
+    readonly triggerRef: UnwrapRef<typeof import('vue')['triggerRef']>
+    readonly tryOnBeforeMount: UnwrapRef<typeof import('@vueuse/core')['tryOnBeforeMount']>
+    readonly tryOnBeforeUnmount: UnwrapRef<typeof import('@vueuse/core')['tryOnBeforeUnmount']>
+    readonly tryOnMounted: UnwrapRef<typeof import('@vueuse/core')['tryOnMounted']>
+    readonly tryOnScopeDispose: UnwrapRef<typeof import('@vueuse/core')['tryOnScopeDispose']>
+    readonly tryOnUnmounted: UnwrapRef<typeof import('@vueuse/core')['tryOnUnmounted']>
+    readonly unref: UnwrapRef<typeof import('vue')['unref']>
+    readonly unrefElement: UnwrapRef<typeof import('@vueuse/core')['unrefElement']>
+    readonly until: UnwrapRef<typeof import('@vueuse/core')['until']>
+    readonly useActiveElement: UnwrapRef<typeof import('@vueuse/core')['useActiveElement']>
+    readonly useAnimate: UnwrapRef<typeof import('@vueuse/core')['useAnimate']>
+    readonly useArrayDifference: UnwrapRef<typeof import('@vueuse/core')['useArrayDifference']>
+    readonly useArrayEvery: UnwrapRef<typeof import('@vueuse/core')['useArrayEvery']>
+    readonly useArrayFilter: UnwrapRef<typeof import('@vueuse/core')['useArrayFilter']>
+    readonly useArrayFind: UnwrapRef<typeof import('@vueuse/core')['useArrayFind']>
+    readonly useArrayFindIndex: UnwrapRef<typeof import('@vueuse/core')['useArrayFindIndex']>
+    readonly useArrayFindLast: UnwrapRef<typeof import('@vueuse/core')['useArrayFindLast']>
+    readonly useArrayIncludes: UnwrapRef<typeof import('@vueuse/core')['useArrayIncludes']>
+    readonly useArrayJoin: UnwrapRef<typeof import('@vueuse/core')['useArrayJoin']>
+    readonly useArrayMap: UnwrapRef<typeof import('@vueuse/core')['useArrayMap']>
+    readonly useArrayReduce: UnwrapRef<typeof import('@vueuse/core')['useArrayReduce']>
+    readonly useArraySome: UnwrapRef<typeof import('@vueuse/core')['useArraySome']>
+    readonly useArrayUnique: UnwrapRef<typeof import('@vueuse/core')['useArrayUnique']>
+    readonly useAsyncQueue: UnwrapRef<typeof import('@vueuse/core')['useAsyncQueue']>
+    readonly useAsyncState: UnwrapRef<typeof import('@vueuse/core')['useAsyncState']>
+    readonly useAttrs: UnwrapRef<typeof import('vue')['useAttrs']>
+    readonly useBase64: UnwrapRef<typeof import('@vueuse/core')['useBase64']>
+    readonly useBattery: UnwrapRef<typeof import('@vueuse/core')['useBattery']>
+    readonly useBluetooth: UnwrapRef<typeof import('@vueuse/core')['useBluetooth']>
+    readonly useBreakpoints: UnwrapRef<typeof import('@vueuse/core')['useBreakpoints']>
+    readonly useBroadcastChannel: UnwrapRef<typeof import('@vueuse/core')['useBroadcastChannel']>
+    readonly useBrowserLocation: UnwrapRef<typeof import('@vueuse/core')['useBrowserLocation']>
+    readonly useCached: UnwrapRef<typeof import('@vueuse/core')['useCached']>
+    readonly useClipboard: UnwrapRef<typeof import('@vueuse/core')['useClipboard']>
+    readonly useClipboardItems: UnwrapRef<typeof import('@vueuse/core')['useClipboardItems']>
+    readonly useCloned: UnwrapRef<typeof import('@vueuse/core')['useCloned']>
+    readonly useColorMode: UnwrapRef<typeof import('@vueuse/core')['useColorMode']>
+    readonly useConfirmDialog: UnwrapRef<typeof import('@vueuse/core')['useConfirmDialog']>
+    readonly useCountdown: UnwrapRef<typeof import('@vueuse/core')['useCountdown']>
+    readonly useCounter: UnwrapRef<typeof import('@vueuse/core')['useCounter']>
+    readonly useCssModule: UnwrapRef<typeof import('vue')['useCssModule']>
+    readonly useCssVar: UnwrapRef<typeof import('@vueuse/core')['useCssVar']>
+    readonly useCssVars: UnwrapRef<typeof import('vue')['useCssVars']>
+    readonly useCurrentElement: UnwrapRef<typeof import('@vueuse/core')['useCurrentElement']>
+    readonly useCycleList: UnwrapRef<typeof import('@vueuse/core')['useCycleList']>
+    readonly useDark: UnwrapRef<typeof import('@vueuse/core')['useDark']>
+    readonly useDateFormat: UnwrapRef<typeof import('@vueuse/core')['useDateFormat']>
+    readonly useDebounce: UnwrapRef<typeof import('@vueuse/core')['useDebounce']>
+    readonly useDebounceFn: UnwrapRef<typeof import('@vueuse/core')['useDebounceFn']>
+    readonly useDebouncedRefHistory: UnwrapRef<typeof import('@vueuse/core')['useDebouncedRefHistory']>
+    readonly useDeviceMotion: UnwrapRef<typeof import('@vueuse/core')['useDeviceMotion']>
+    readonly useDeviceOrientation: UnwrapRef<typeof import('@vueuse/core')['useDeviceOrientation']>
+    readonly useDevicePixelRatio: UnwrapRef<typeof import('@vueuse/core')['useDevicePixelRatio']>
+    readonly useDevicesList: UnwrapRef<typeof import('@vueuse/core')['useDevicesList']>
+    readonly useDialog: UnwrapRef<typeof import('naive-ui')['useDialog']>
+    readonly useDisplayMedia: UnwrapRef<typeof import('@vueuse/core')['useDisplayMedia']>
+    readonly useDocumentVisibility: UnwrapRef<typeof import('@vueuse/core')['useDocumentVisibility']>
+    readonly useDraggable: UnwrapRef<typeof import('@vueuse/core')['useDraggable']>
+    readonly useDropZone: UnwrapRef<typeof import('@vueuse/core')['useDropZone']>
+    readonly useElementBounding: UnwrapRef<typeof import('@vueuse/core')['useElementBounding']>
+    readonly useElementByPoint: UnwrapRef<typeof import('@vueuse/core')['useElementByPoint']>
+    readonly useElementHover: UnwrapRef<typeof import('@vueuse/core')['useElementHover']>
+    readonly useElementSize: UnwrapRef<typeof import('@vueuse/core')['useElementSize']>
+    readonly useElementVisibility: UnwrapRef<typeof import('@vueuse/core')['useElementVisibility']>
+    readonly useEventBus: UnwrapRef<typeof import('@vueuse/core')['useEventBus']>
+    readonly useEventListener: UnwrapRef<typeof import('@vueuse/core')['useEventListener']>
+    readonly useEventSource: UnwrapRef<typeof import('@vueuse/core')['useEventSource']>
+    readonly useEyeDropper: UnwrapRef<typeof import('@vueuse/core')['useEyeDropper']>
+    readonly useFavicon: UnwrapRef<typeof import('@vueuse/core')['useFavicon']>
+    readonly useFetch: UnwrapRef<typeof import('@vueuse/core')['useFetch']>
+    readonly useFileDialog: UnwrapRef<typeof import('@vueuse/core')['useFileDialog']>
+    readonly useFileSystemAccess: UnwrapRef<typeof import('@vueuse/core')['useFileSystemAccess']>
+    readonly useFocus: UnwrapRef<typeof import('@vueuse/core')['useFocus']>
+    readonly useFocusWithin: UnwrapRef<typeof import('@vueuse/core')['useFocusWithin']>
+    readonly useFps: UnwrapRef<typeof import('@vueuse/core')['useFps']>
+    readonly useFullscreen: UnwrapRef<typeof import('@vueuse/core')['useFullscreen']>
+    readonly useGamepad: UnwrapRef<typeof import('@vueuse/core')['useGamepad']>
+    readonly useGeolocation: UnwrapRef<typeof import('@vueuse/core')['useGeolocation']>
+    readonly useI18n: UnwrapRef<typeof import('vue-i18n')['useI18n']>
+    readonly useId: UnwrapRef<typeof import('vue')['useId']>
+    readonly useIdle: UnwrapRef<typeof import('@vueuse/core')['useIdle']>
+    readonly useImage: UnwrapRef<typeof import('@vueuse/core')['useImage']>
+    readonly useInfiniteScroll: UnwrapRef<typeof import('@vueuse/core')['useInfiniteScroll']>
+    readonly useIntersectionObserver: UnwrapRef<typeof import('@vueuse/core')['useIntersectionObserver']>
+    readonly useInterval: UnwrapRef<typeof import('@vueuse/core')['useInterval']>
+    readonly useIntervalFn: UnwrapRef<typeof import('@vueuse/core')['useIntervalFn']>
+    readonly useKeyModifier: UnwrapRef<typeof import('@vueuse/core')['useKeyModifier']>
+    readonly useLastChanged: UnwrapRef<typeof import('@vueuse/core')['useLastChanged']>
+    readonly useLink: UnwrapRef<typeof import('vue-router/auto')['useLink']>
+    readonly useLoadingBar: UnwrapRef<typeof import('naive-ui')['useLoadingBar']>
+    readonly useLocalStorage: UnwrapRef<typeof import('@vueuse/core')['useLocalStorage']>
+    readonly useMagicKeys: UnwrapRef<typeof import('@vueuse/core')['useMagicKeys']>
+    readonly useManualRefHistory: UnwrapRef<typeof import('@vueuse/core')['useManualRefHistory']>
+    readonly useMediaControls: UnwrapRef<typeof import('@vueuse/core')['useMediaControls']>
+    readonly useMediaQuery: UnwrapRef<typeof import('@vueuse/core')['useMediaQuery']>
+    readonly useMemoize: UnwrapRef<typeof import('@vueuse/core')['useMemoize']>
+    readonly useMemory: UnwrapRef<typeof import('@vueuse/core')['useMemory']>
+    readonly useMessage: UnwrapRef<typeof import('naive-ui')['useMessage']>
+    readonly useModal: UnwrapRef<typeof import('naive-ui')['useModal']>
+    readonly useModel: UnwrapRef<typeof import('vue')['useModel']>
+    readonly useMounted: UnwrapRef<typeof import('@vueuse/core')['useMounted']>
+    readonly useMouse: UnwrapRef<typeof import('@vueuse/core')['useMouse']>
+    readonly useMouseInElement: UnwrapRef<typeof import('@vueuse/core')['useMouseInElement']>
+    readonly useMousePressed: UnwrapRef<typeof import('@vueuse/core')['useMousePressed']>
+    readonly useMutationObserver: UnwrapRef<typeof import('@vueuse/core')['useMutationObserver']>
+    readonly useNavigatorLanguage: UnwrapRef<typeof import('@vueuse/core')['useNavigatorLanguage']>
+    readonly useNetwork: UnwrapRef<typeof import('@vueuse/core')['useNetwork']>
+    readonly useNotification: UnwrapRef<typeof import('naive-ui')['useNotification']>
+    readonly useNow: UnwrapRef<typeof import('@vueuse/core')['useNow']>
+    readonly useObjectUrl: UnwrapRef<typeof import('@vueuse/core')['useObjectUrl']>
+    readonly useOffsetPagination: UnwrapRef<typeof import('@vueuse/core')['useOffsetPagination']>
+    readonly useOnline: UnwrapRef<typeof import('@vueuse/core')['useOnline']>
+    readonly usePageLeave: UnwrapRef<typeof import('@vueuse/core')['usePageLeave']>
+    readonly useParallax: UnwrapRef<typeof import('@vueuse/core')['useParallax']>
+    readonly useParentElement: UnwrapRef<typeof import('@vueuse/core')['useParentElement']>
+    readonly usePerformanceObserver: UnwrapRef<typeof import('@vueuse/core')['usePerformanceObserver']>
+    readonly usePermission: UnwrapRef<typeof import('@vueuse/core')['usePermission']>
+    readonly usePointer: UnwrapRef<typeof import('@vueuse/core')['usePointer']>
+    readonly usePointerLock: UnwrapRef<typeof import('@vueuse/core')['usePointerLock']>
+    readonly usePointerSwipe: UnwrapRef<typeof import('@vueuse/core')['usePointerSwipe']>
+    readonly usePreferredColorScheme: UnwrapRef<typeof import('@vueuse/core')['usePreferredColorScheme']>
+    readonly usePreferredContrast: UnwrapRef<typeof import('@vueuse/core')['usePreferredContrast']>
+    readonly usePreferredDark: UnwrapRef<typeof import('@vueuse/core')['usePreferredDark']>
+    readonly usePreferredLanguages: UnwrapRef<typeof import('@vueuse/core')['usePreferredLanguages']>
+    readonly usePreferredReducedMotion: UnwrapRef<typeof import('@vueuse/core')['usePreferredReducedMotion']>
+    readonly usePreferredReducedTransparency: UnwrapRef<typeof import('@vueuse/core')['usePreferredReducedTransparency']>
+    readonly usePrevious: UnwrapRef<typeof import('@vueuse/core')['usePrevious']>
+    readonly useRafFn: UnwrapRef<typeof import('@vueuse/core')['useRafFn']>
+    readonly useRefHistory: UnwrapRef<typeof import('@vueuse/core')['useRefHistory']>
+    readonly useRefs: UnwrapRef<typeof import('utils4u/vue-use')['useRefs']>
+    readonly useResizeObserver: UnwrapRef<typeof import('@vueuse/core')['useResizeObserver']>
+    readonly useRoute: UnwrapRef<typeof import('vue-router')['useRoute']>
+    readonly useRouter: UnwrapRef<typeof import('vue-router')['useRouter']>
+    readonly useSSRWidth: UnwrapRef<typeof import('@vueuse/core')['useSSRWidth']>
+    readonly useScreenOrientation: UnwrapRef<typeof import('@vueuse/core')['useScreenOrientation']>
+    readonly useScreenSafeArea: UnwrapRef<typeof import('@vueuse/core')['useScreenSafeArea']>
+    readonly useScriptTag: UnwrapRef<typeof import('@vueuse/core')['useScriptTag']>
+    readonly useScroll: UnwrapRef<typeof import('@vueuse/core')['useScroll']>
+    readonly useScrollLock: UnwrapRef<typeof import('@vueuse/core')['useScrollLock']>
+    readonly useSessionStorage: UnwrapRef<typeof import('@vueuse/core')['useSessionStorage']>
+    readonly useShare: UnwrapRef<typeof import('@vueuse/core')['useShare']>
+    readonly useSlots: UnwrapRef<typeof import('vue')['useSlots']>
+    readonly useSorted: UnwrapRef<typeof import('@vueuse/core')['useSorted']>
+    readonly useSpeechRecognition: UnwrapRef<typeof import('@vueuse/core')['useSpeechRecognition']>
+    readonly useSpeechSynthesis: UnwrapRef<typeof import('@vueuse/core')['useSpeechSynthesis']>
+    readonly useStepper: UnwrapRef<typeof import('@vueuse/core')['useStepper']>
+    readonly useStorage: UnwrapRef<typeof import('@vueuse/core')['useStorage']>
+    readonly useStorageAsync: UnwrapRef<typeof import('@vueuse/core')['useStorageAsync']>
+    readonly useStyleTag: UnwrapRef<typeof import('@vueuse/core')['useStyleTag']>
+    readonly useSupported: UnwrapRef<typeof import('@vueuse/core')['useSupported']>
+    readonly useSwipe: UnwrapRef<typeof import('@vueuse/core')['useSwipe']>
+    readonly useTemplateRef: UnwrapRef<typeof import('vue')['useTemplateRef']>
+    readonly useTemplateRefsList: UnwrapRef<typeof import('@vueuse/core')['useTemplateRefsList']>
+    readonly useTextDirection: UnwrapRef<typeof import('@vueuse/core')['useTextDirection']>
+    readonly useTextSelection: UnwrapRef<typeof import('@vueuse/core')['useTextSelection']>
+    readonly useTextareaAutosize: UnwrapRef<typeof import('@vueuse/core')['useTextareaAutosize']>
+    readonly useThrottle: UnwrapRef<typeof import('@vueuse/core')['useThrottle']>
+    readonly useThrottleFn: UnwrapRef<typeof import('@vueuse/core')['useThrottleFn']>
+    readonly useThrottledRefHistory: UnwrapRef<typeof import('@vueuse/core')['useThrottledRefHistory']>
+    readonly useTimeAgo: UnwrapRef<typeof import('@vueuse/core')['useTimeAgo']>
+    readonly useTimeAgoIntl: UnwrapRef<typeof import('@vueuse/core')['useTimeAgoIntl']>
+    readonly useTimeout: UnwrapRef<typeof import('@vueuse/core')['useTimeout']>
+    readonly useTimeoutFn: UnwrapRef<typeof import('@vueuse/core')['useTimeoutFn']>
+    readonly useTimeoutPoll: UnwrapRef<typeof import('@vueuse/core')['useTimeoutPoll']>
+    readonly useTimestamp: UnwrapRef<typeof import('@vueuse/core')['useTimestamp']>
+    readonly useTitle: UnwrapRef<typeof import('@vueuse/core')['useTitle']>
+    readonly useToNumber: UnwrapRef<typeof import('@vueuse/core')['useToNumber']>
+    readonly useToString: UnwrapRef<typeof import('@vueuse/core')['useToString']>
+    readonly useToggle: UnwrapRef<typeof import('@vueuse/core')['useToggle']>
+    readonly useTransition: UnwrapRef<typeof import('@vueuse/core')['useTransition']>
+    readonly useUrlSearchParams: UnwrapRef<typeof import('@vueuse/core')['useUrlSearchParams']>
+    readonly useUserMedia: UnwrapRef<typeof import('@vueuse/core')['useUserMedia']>
+    readonly useVModel: UnwrapRef<typeof import('@vueuse/core')['useVModel']>
+    readonly useVModels: UnwrapRef<typeof import('@vueuse/core')['useVModels']>
+    readonly useVibrate: UnwrapRef<typeof import('@vueuse/core')['useVibrate']>
+    readonly useVirtualList: UnwrapRef<typeof import('@vueuse/core')['useVirtualList']>
+    readonly useWakeLock: UnwrapRef<typeof import('@vueuse/core')['useWakeLock']>
+    readonly useWebNotification: UnwrapRef<typeof import('@vueuse/core')['useWebNotification']>
+    readonly useWebSocket: UnwrapRef<typeof import('@vueuse/core')['useWebSocket']>
+    readonly useWebWorker: UnwrapRef<typeof import('@vueuse/core')['useWebWorker']>
+    readonly useWebWorkerFn: UnwrapRef<typeof import('@vueuse/core')['useWebWorkerFn']>
+    readonly useWindowFocus: UnwrapRef<typeof import('@vueuse/core')['useWindowFocus']>
+    readonly useWindowScroll: UnwrapRef<typeof import('@vueuse/core')['useWindowScroll']>
+    readonly useWindowSize: UnwrapRef<typeof import('@vueuse/core')['useWindowSize']>
+    readonly watch: UnwrapRef<typeof import('vue')['watch']>
+    readonly watchArray: UnwrapRef<typeof import('@vueuse/core')['watchArray']>
+    readonly watchAtMost: UnwrapRef<typeof import('@vueuse/core')['watchAtMost']>
+    readonly watchDebounced: UnwrapRef<typeof import('@vueuse/core')['watchDebounced']>
+    readonly watchDeep: UnwrapRef<typeof import('@vueuse/core')['watchDeep']>
+    readonly watchEffect: UnwrapRef<typeof import('vue')['watchEffect']>
+    readonly watchIgnorable: UnwrapRef<typeof import('@vueuse/core')['watchIgnorable']>
+    readonly watchImmediate: UnwrapRef<typeof import('@vueuse/core')['watchImmediate']>
+    readonly watchOnce: UnwrapRef<typeof import('@vueuse/core')['watchOnce']>
+    readonly watchPausable: UnwrapRef<typeof import('@vueuse/core')['watchPausable']>
+    readonly watchPostEffect: UnwrapRef<typeof import('vue')['watchPostEffect']>
+    readonly watchSyncEffect: UnwrapRef<typeof import('vue')['watchSyncEffect']>
+    readonly watchThrottled: UnwrapRef<typeof import('@vueuse/core')['watchThrottled']>
+    readonly watchTriggerable: UnwrapRef<typeof import('@vueuse/core')['watchTriggerable']>
+    readonly watchWithFilter: UnwrapRef<typeof import('@vueuse/core')['watchWithFilter']>
+    readonly whenever: UnwrapRef<typeof import('@vueuse/core')['whenever']>
+  }
+}
--- a/env.d.ts
+++ b/env.d.ts
@@ -1 +1,9 @@
 /// <reference types="vite/client" />
+/// <reference types="vitest" />
+/// <reference types="vite-plugin-vue-layouts/client" />
+/// <reference types="vite-plugin-vue-meta-layouts/client" />
+/* /// <reference types="vite-plugin-pwa/client" /> */
+/// <reference types="unplugin-vue-macros/macros-global" />
+/// <reference types="unplugin-vue-router/client" />
+/// <reference types="unplugin-icons/types/vue" />
+/// <reference types="@intlify/unplugin-vue-i18n/messages" />
--- a/eslint.config.ts
+++ b/eslint.config.ts
@@ -33,4 +33,23 @@ export default defineConfigWithVueTs(
  },
  ...pluginOxlint.configs['flat/recommended'],
  skipFormatting,
+
+  {
+    rules: {
+      '@typescript-eslint/no-explicit-any': 'off',
+      'vue/block-order': [
+        'error',
+        {
+          order: ['script', 'template', 'style'],
+        },
+      ],
+      'vue/define-macros-order': [
+        'error',
+        {
+          order: ['defineOptions', 'defineProps', 'defineEmits', 'defineSlots'],
+        },
+      ],
+      'vue/multi-word-component-names': 'off',
+    },
+  },
 )
--- a/fake/upload.fake.ts
+++ b/fake/upload.fake.ts
@@ -0,0 +1,26 @@
+// fake/user.fake.ts
+import { defineFakeRoute } from 'vite-plugin-fake-server/client';
+
+let fail = !false;
+export default defineFakeRoute([
+  {
+    method: 'POST',
+    rawResponse(req, res) {
+      fail = !fail;
+      if (fail) {
+        res.writeHead(500, { 'Content-Type': 'application/json' });
+        res.end(JSON.stringify({ error: 'Upload failed' }));
+      } else {
+        res.writeHead(200, { 'Content-Type': 'application/json' });
+        res.end(JSON.stringify({ url: 'https://picsum.photos/200/300' }));
+      }
+    },
+    response: () => {
+      return {
+        url: 'https://picsum.photos/200/300',
+      };
+    },
+    timeout: 2000,
+    url: '/fake/upload',
+  },
+]);
--- a/index.html
+++ b/index.html
@@ -2,12 +2,86 @@
 <html lang="zh-CN" data-build-time="%VITE_BUILD_TIME%" data-commit="%VITE_BUILD_COMMIT%">
  <head>
    <meta charset="UTF-8" />
+    <!-- <link rel="icon" href="data:;base64,iVBORw0KGgo=" /> -->
    <link rel="icon" href="/favicon.ico" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite App</title>
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover, user-scalable=no"
+    />
+    <meta name="format-detection" content="telephone=no" />
+    <title>vue-ts-example-2025</title>
+    <style type="text/css">
+      body {
+        text-rendering: optimizeLegibility;
+        -webkit-font-smoothing: antialiased;
+        -moz-osx-font-smoothing: grayscale;
+        margin: 0;
+      }
+      @media (prefers-color-scheme: dark) {
+        body {
+          background-color: #000;
+        }
+      }
+      #app {
+        min-height: 100vh;
+        display: flex;
+        flex-direction: column;
+      }
+
+      @supports (min-height: 100dvh) {
+        #app {
+          min-height: 100dvh;
+        }
+        html .min-h-screen {
+          min-height: 100dvh;
+        }
+      }
+      .page-wrapper {
+        flex-grow: 1;
+      }
+    </style>
  </head>
+
+  <!-- ontouchstart ontouchend -->
  <body>
-    <div id="app"></div>
+    <div id="app">
+      <div class="page-wrapper" style="display: flex; justify-content: center; align-items: center">
+        Loading...
+      </div>
+    </div>
    <script type="module" src="/src/main.ts"></script>
+    <!-- <script src="https://testingcf.jsdelivr.net/npm/@vant/touch-emulator/dist/index.min.js"></script> -->
+    <!-- .min.js 是 jsDelivr 的特殊处理 -->
+    <!-- <script src="https://unpkg.luckincdn.com/@vant/touch-emulator@1.4.0/dist/index.js"></script> -->
  </body>
+  <script>
+    ;(function (d) {
+      var config = {
+          kitId: 'whk2tto',
+          scriptTimeout: 3000,
+          async: true,
+        },
+        h = d.documentElement,
+        t = setTimeout(function () {
+          h.className = h.className.replace(/\bwf-loading\b/g, '') + ' wf-inactive'
+        }, config.scriptTimeout),
+        tk = d.createElement('script'),
+        f = false,
+        s = d.getElementsByTagName('script')[0],
+        a
+      h.className += ' wf-loading'
+      tk.src = 'https://use.typekit.net/' + config.kitId + '.js'
+      tk.async = true
+      tk.onload = tk.onreadystatechange = function () {
+        a = this.readyState
+        if (f || (a && a != 'complete' && a != 'loaded')) return
+        f = true
+        clearTimeout(t)
+        try {
+          Typekit.load(config)
+        } catch (e) {}
+      }
+      s.parentNode.insertBefore(tk, s)
+    }) /* (document) */
+  </script>
 </html>
--- a/package.json
+++ b/package.json
@@ -56,18 +56,31 @@
  "dependencies": {
    "@commitlint/cli": "^19.8.1",
    "@commitlint/config-conventional": "^19.8.1",
+    "@formkit/auto-animate": "^0.9.0",
+    "@pinia/colada": "^0.17.3",
+    "@primeuix/themes": "^1.2.3",
+    "@unhead/vue": "^2.0.14",
+    "@vueuse/core": "^13.9.0",
    "pinia": "^3.0.3",
+    "pinia-plugin-persistedstate": "^4.5.0",
+    "primelocale": "^2.1.7",
+    "primevue": "^4.3.9",
+    "utils4u": "^4.2.3",
    "vue": "^3.5.21",
+    "vue-i18n": "^11.1.12",
    "vue-router": "^4.5.1"
  },
  "devDependencies": {
    "@cloudflare/vite-plugin": "^1.12.3",
    "@commitlint/types": "^19.8.1",
+    "@intlify/unplugin-vue-i18n": "^11.0.0",
    "@playwright/test": "^1.55.0",
    "@prettier/plugin-oxc": "^0.0.4",
+    "@primevue/auto-import-resolver": "^4.3.9",
    "@tsconfig/node22": "^22.0.2",
    "@types/jsdom": "^21.1.7",
    "@types/node": "^22.18.1",
+    "@vant/auto-import-resolver": "^1.3.0",
    "@vitejs/plugin-vue": "^6.0.1",
    "@vitejs/plugin-vue-jsx": "^5.1.1",
    "@vitest/eslint-plugin": "^1.3.9",
@@ -84,12 +97,26 @@
    "jsdom": "^26.1.0",
    "lint-staged": "^16.1.6",
    "npm-run-all2": "^8.0.4",
+    "nprogress": "^0.2.0",
    "oxlint": "~1.14.0",
    "prettier": "3.6.2",
    "typescript": "~5.9.2",
+    "unocss": "^66.5.1",
+    "unocss-preset-animations": "^1.2.1",
+    "unplugin-auto-import": "^20.1.0",
+    "unplugin-icons": "^22.2.0",
+    "unplugin-vue-components": "^29.0.0",
+    "unplugin-vue-markdown": "^29.1.0",
+    "unplugin-vue-router": "^0.15.0",
    "vite": "npm:rolldown-vite@^7.1.8",
+    "vite-plugin-checker": "^0.10.3",
+    "vite-plugin-fake-server": "^2.2.0",
+    "vite-plugin-image-optimizer": "^2.0.2",
    "vite-plugin-vue-devtools": "^8.0.1",
+    "vite-plugin-vue-meta-layouts": "^0.6.0",
+    "vite-plugin-webfont-dl": "^3.11.1",
    "vitest": "^3.2.4",
+    "vue-macros": "3.0.0-beta.23",
    "vue-tsc": "^3.0.6",
    "wrangler": "^4.34.0"
  }
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
--- a/src/App.vue
+++ b/src/App.vue
@@ -11,12 +11,19 @@ const getName = async () => {
 </script>

 <template>
+  <div>
    <h1>You did it!</h1>
    <p>
      Visit <a href="https://vuejs.org/" target="_blank" rel="noopener">vuejs.org</a> to read the
      documentation
    </p>
-  <button class="green" @click="getName" aria-label="get name">Name from API is: {{ name }}</button>
+    <button class="green" @click="getName" aria-label="get name">
+      Name from API is: {{ name }}
+    </button>
+  </div>
+
+  <DynamicDialog /> <ConfirmDialog /> <Toast />
+  <RouterView />
 </template>

 <style scoped></style>
--- a/src/layouts/naive-ui/AppLayout.vue
+++ b/src/layouts/naive-ui/AppLayout.vue
@@ -0,0 +1,10 @@
+<script setup lang="ts"></script>
+
+<template>
+  <div>
+    <div>AppLayout</div>
+    <router-view />
+  </div>
+</template>
+
+<style scoped></style>
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,12 +1,13 @@
-import { createApp } from 'vue'
-import { createPinia } from 'pinia'
+import './styles'
+
+// import { LogLevels } from 'consola';
+// consola.level = LogLevels.verbose;

 import App from './App.vue'
-import router from './router'

-const app = createApp(App)
+const autoInstallModules = import.meta.glob('./plugins/!(index).ts', { eager: true })

-app.use(createPinia())
-app.use(router)
+// import { setupPlugins } from './plugins'
+const setupPlugins = (await import('./plugins')).setupPlugins

-app.mount('#app')
+setupPlugins(createApp(App), autoInstallModules).mount('#app')
--- a/src/pages/[...path].page.vue
+++ b/src/pages/[...path].page.vue
@@ -0,0 +1,16 @@
+<script lang="ts" setup>
+defineProps<{ path: string }>()
+</script>
+<template>
+  <main flex-1 class="flex flex-col items-center justify-center h-full space-y-4">
+    <h1>Not Found</h1>
+    <p>{{ path }} does not exist.</p>
+    <Button @click="$router.back()">Back</Button>
+  </main>
+</template>
+
+<route lang="yaml">
+props: true
+meta:
+  layout: false
+</route>
--- a/src/pages/index.page.vue
+++ b/src/pages/index.page.vue
@@ -0,0 +1,7 @@
+<script setup lang="ts"></script>
+
+<template>
+  <div></div>
+</template>
+
+<style scoped></style>
--- a/src/plugins/_.ts
+++ b/src/plugins/_.ts
@@ -0,0 +1,32 @@
+import { autoAnimatePlugin } from '@formkit/auto-animate/vue'
+import { createHead } from '@unhead/vue/client'
+
+export function install({ app }: { app: import('vue').App<Element> }) {
+  app.config.globalProperties.__DEV__ = __DEV__
+
+  app.use(autoAnimatePlugin) // v-auto-animate="{ duration: 100 }"
+
+  app.use(createHead())
+  app.config.errorHandler = (error, instance, info) => {
+    console.error('Global error:', error)
+    console.error('Component:', instance)
+    console.error('Error Info:', info)
+    // 这里你可以：
+    // 1. 发送错误到日志服务
+    // 2. 显示全局错误提示
+    // 3. 进行错误分析和处理
+  }
+
+  // if (import.meta.env.MODE === 'development' && '1' === ('2' as never)) {
+  //   // TODO: https://github.com/hu3dao/vite-plugin-debug/
+  //   // https://eruda.liriliri.io/zh/docs/#快速上手
+  //   import('eruda').then(({ default: eruda }) => {
+  //     eruda.init({
+  //       defaults: {
+  //         transparency: 0.9,
+  //       },
+  //     })
+  //     /* eruda.show(); */
+  //   })
+  // }
+}
--- a/src/plugins/index.ts
+++ b/src/plugins/index.ts
@@ -0,0 +1,24 @@
+/**
+ * https://github.com/antfu-collective/vitesse/blob/47618e72dfba76c77b9b85b94784d739e35c492b/src/modules/README.md
+ */
+type UserPlugin = (ctx: UserPluginContext) => void
+type AutoInstallModule = { [K: string]: unknown; install?: UserPlugin }
+type UserPluginContext = { app: import('vue').App<Element> }
+export function setupPlugins(
+  app: import('vue').App,
+  modules: AutoInstallModule | Record<string, unknown>,
+) {
+  console.group('🔌 Plugins')
+  for (const path in modules) {
+    const module = modules[path] as AutoInstallModule
+    if (module.install) {
+      module.install({ app })
+      console.debug(`%c✔ ${path}`, 'color: #07a')
+    } else {
+      if (typeof module.setupPlugins === 'function') continue
+      console.warn(`%c✘ ${path} has no install function`, 'color: #f50')
+    }
+  }
+  console.groupEnd()
+  return app
+}
--- a/src/plugins/pinia.ts
+++ b/src/plugins/pinia.ts
@@ -0,0 +1,6 @@
+import { PiniaColada } from '@pinia/colada'
+import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
+export function install({ app }: { app: import('vue').App<Element> }) {
+  app.use(createPinia().use(piniaPluginPersistedstate))
+  app.use(PiniaColada, {})
+}
--- a/src/plugins/primevue.ts
+++ b/src/plugins/primevue.ts
@@ -0,0 +1,28 @@
+/**
+ * 需要把 <DynamicDialog /> <ConfirmDialog /> <Toast /> 放在 App.vue 的 template 中
+ */
+
+import Aura from '@primeuix/themes/aura'
+import zhCN from 'primelocale/zh-CN.json'
+import PrimeVue from 'primevue/config'
+import StyleClass from 'primevue/styleclass'
+
+export function install({ app }: { app: import('vue').App<Element> }) {
+  app.directive('styleclass', StyleClass)
+  app.use(PrimeVue, {
+    locale: {
+      ...zhCN['zh-CN'],
+      completed: '已上传',
+      noFileChosenMessage: '未选择文件',
+      pending: '待上传',
+    }, // usePrimeVue().config.locale
+    theme: {
+      options: {
+        cssLayer: false,
+        darkModeSelector: '.app-dark' /* 'system' */,
+        prefix: 'p',
+      },
+      preset: Aura,
+    },
+  })
+}
--- a/src/plugins/router.ts
+++ b/src/plugins/router.ts
@@ -0,0 +1,58 @@
+import { DataLoaderPlugin } from 'unplugin-vue-router/data-loaders'
+import { setupLayouts } from 'virtual:meta-layouts'
+// import { createGetRoutes, setupLayouts } from 'virtual:generated-layouts';
+import { createRouter, createWebHistory } from 'vue-router'
+import { handleHotUpdate, routes } from 'vue-router/auto-routes'
+
+const setupLayoutsResult = setupLayouts(routes)
+const router = createRouter({
+  history: createWebHistory(import.meta.env.BASE_URL),
+  routes: /* routes ?? */ setupLayoutsResult,
+  scrollBehavior: (_to, _from, savedPosition) => {
+    return savedPosition ?? { left: 0, top: 0 }
+  },
+  strict: true,
+})
+if (import.meta.hot) handleHotUpdate(router)
+if (__DEV__) Object.assign(globalThis, { router })
+router.onError((error) => {
+  console.debug('🚨 [router error]:', error)
+})
+
+export { router, setupLayoutsResult }
+export function install({ app }: { app: import('vue').App<Element> }) {
+  app
+    // 在路由之前注册插件
+    .use(DataLoaderPlugin, { router })
+    // 添加路由会触发初始导航
+    .use(router)
+}
+// ========================================================================
+// =========================== Router Guards ==============================
+// ========================================================================
+{
+  // 警告：路由守卫的创建顺序会影响执行流程，请勿调整
+  createNProgressGuard(router)
+  createLogGuard(router)
+  Object.assign(globalThis, { stack: createStackGuard(router) })
+}
+
+/*
+definePage({
+  meta: { },
+});
+ */
+declare module 'vue-router' {
+  interface RouteMeta {
+    /**
+     * @description 是否在菜单中隐藏
+     */
+    hidden?: boolean
+    /**
+     * @description 菜单标题
+     */
+    title?: string
+  }
+}
+
+export { createGetRoutes } from 'virtual:meta-layouts'
--- a/src/plugins/vue-i18n.ts
+++ b/src/plugins/vue-i18n.ts
@@ -0,0 +1,17 @@
+/* https://github.com/intlify/bundle-tools/tree/main/packages/unplugin-vue-i18n#static-bundle-importing
+ * All i18n resources specified in the plugin `include` option can be loaded
+ * at once using the import syntax
+ */
+import messages from '@intlify/unplugin-vue-i18n/messages'
+import { createI18n } from 'vue-i18n'
+
+export function install({ app }: { app: import('vue').App<Element> }) {
+  app.use(
+    // https://vue-i18n.intlify.dev/guide/essentials/started.html#registering-the-i18n-plugin
+    createI18n({
+      legacy: false, // you must set `false`, to use Composition API
+      locale: navigator.language,
+      messages,
+    }),
+  )
+}
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -1,8 +0,0 @@
-import { createRouter, createWebHistory } from 'vue-router'
-
-const router = createRouter({
-  history: createWebHistory(import.meta.env.BASE_URL),
-  routes: [],
-})
-
-export default router
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -0,0 +1,4 @@
+import 'nprogress/nprogress.css' // <link rel="stylesheet" href="https://testingcf.jsdelivr.net/npm/nprogress/nprogress.css" />
+
+//
+import 'virtual:uno.css'
--- a/src/types/global.ts
+++ b/src/types/global.ts
@@ -0,0 +1,9 @@
+declare global {
+  const __DEV__: boolean
+}
+
+declare module 'vue' {
+  export interface ComponentCustomProperties {
+    __DEV__: boolean
+  }
+}
--- a/tsconfig.app.json
+++ b/tsconfig.app.json
@@ -1,6 +1,13 @@
 {
  "extends": "@vue/tsconfig/tsconfig.dom.json",
-  "include": ["env.d.ts", "src/**/*", "src/**/*.vue"],
+  "include": [
+    "env.d.ts",
+    "src/**/*",
+    "src/**/*.vue",
+    "./auto-imports.d.ts",
+    "./typed-router.d.ts",
+    "./components.d.ts"
+  ],
  "exclude": ["src/**/__tests__/*"],
  "compilerOptions": {
    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
--- a/tsconfig.node.json
+++ b/tsconfig.node.json
@@ -6,7 +6,8 @@
    "cypress.config.*",
    "nightwatch.conf.*",
    "playwright.config.*",
-    "eslint.config.*"
+    "eslint.config.*",
+    "fake/**/*"
  ],
  "compilerOptions": {
    "noEmit": true,
--- a/typed-router.d.ts
+++ b/typed-router.d.ts
@@ -0,0 +1,56 @@
+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// Generated by unplugin-vue-router. ‼️ DO NOT MODIFY THIS FILE ‼️
+// It's recommended to commit this file.
+// Make sure to add this file to your tsconfig.json file as an "includes" or "files" entry.
+
+declare module 'vue-router/auto-routes' {
+  import type {
+    RouteRecordInfo,
+    ParamValue,
+    ParamValueOneOrMore,
+    ParamValueZeroOrMore,
+    ParamValueZeroOrOne,
+  } from 'vue-router'
+
+  /**
+   * Route name map generated by unplugin-vue-router
+   */
+  export interface RouteNamedMap {
+    'Root': RouteRecordInfo<'Root', '/', Record<never, never>, Record<never, never>>,
+    '$Path': RouteRecordInfo<'$Path', '/:path(.*)', { path: ParamValue<true> }, { path: ParamValue<false> }>,
+  }
+
+  /**
+   * Route file to route info map by unplugin-vue-router.
+   * Used by the volar plugin to automatically type useRoute()
+   *
+   * Each key is a file path relative to the project root with 2 properties:
+   * - routes: union of route names of the possible routes when in this page (passed to useRoute<...>())
+   * - views: names of nested views (can be passed to <RouterView name="...">)
+   *
+   * @internal
+   */
+  export interface _RouteFileInfoMap {
+    'src/pages/index.page.vue': {
+      routes: 'Root'
+      views: never
+    }
+    'src/pages/[...path].page.vue': {
+      routes: '$Path'
+      views: never
+    }
+  }
+
+  /**
+   * Get a union of possible route names in a certain route component file.
+   * Used by the volar plugin to automatically type useRoute()
+   *
+   * @internal
+   */
+  export type _RouteNamesForFilePath<FilePath extends string> =
+    _RouteFileInfoMap extends Record<FilePath, infer Info>
+      ? Info['routes']
+      : keyof RouteNamedMap
+}
--- a/unocss.config.ts
+++ b/unocss.config.ts
@@ -0,0 +1,41 @@
+// 请确保在 `main.ts` 文件中添加以下导入语句：import 'virtual:uno.css';
+
+// https://github.dev/unocss/unocss/tree/main/examples/vite-vue3
+
+import { defineConfig, presetAttributify, presetWind4, transformerDirectives, transformerVariantGroup } from 'unocss';
+import { presetAnimations } from 'unocss-preset-animations';
+
+export default defineConfig({
+  presets: [
+    presetWind4({
+      dark: {
+        dark: '.app-dark',
+      },
+    }),
+
+    // https://unocss-preset-animations.aelita.me
+    presetAnimations(),
+
+    // https://unocss.dev/presets/attributify
+    presetAttributify(),
+  ],
+
+  shortcuts: [
+    {
+      'logo-transform': 'i-icon:pacman w-6em h-6em transform transition-800',
+      pacman: 'i-icon:pacman text-(pink 36)',
+    },
+  ],
+  transformers: [
+    //https://unocss.dev/transformers/variant-group
+    transformerVariantGroup(),
+
+    // https://unocss.dev/transformers/directives
+    transformerDirectives(),
+  ],
+});
+
+/*
+  示例:
+  - text-[var(--h-gray-1)]
+*/
--- a/vite.config.plugins.ts
+++ b/vite.config.plugins.ts
@@ -0,0 +1,230 @@
+import { cloudflare } from '@cloudflare/vite-plugin'
+import VueI18n from '@intlify/unplugin-vue-i18n/vite'
+import { PrimeVueResolver } from '@primevue/auto-import-resolver'
+import { VantResolver } from '@vant/auto-import-resolver'
+import vue from '@vitejs/plugin-vue'
+import vueJsx from '@vitejs/plugin-vue-jsx'
+import path from 'node:path'
+import UnoCSS from 'unocss/vite'
+import AutoImport from 'unplugin-auto-import/vite'
+import { FileSystemIconLoader } from 'unplugin-icons/loaders'
+import IconsResolver from 'unplugin-icons/resolver'
+import Icons from 'unplugin-icons/vite'
+import {
+  AntDesignVueResolver,
+  NaiveUiResolver,
+  TDesignResolver,
+} from 'unplugin-vue-components/resolvers'
+import Components from 'unplugin-vue-components/vite'
+import Markdown from 'unplugin-vue-markdown/vite'
+import { getPascalCaseRouteName, VueRouterAutoImports } from 'unplugin-vue-router'
+import vueRouter from 'unplugin-vue-router/vite'
+import { createUtils4uAutoImports } from 'utils4u/auto-imports'
+import { type PluginOption } from 'vite'
+import { checker } from 'vite-plugin-checker'
+import { vitePluginFakeServer } from 'vite-plugin-fake-server'
+import { ViteImageOptimizer } from 'vite-plugin-image-optimizer'
+import vueDevTools from 'vite-plugin-vue-devtools'
+import MetaLayouts from 'vite-plugin-vue-meta-layouts'
+import { ViteWebfontDownload } from 'vite-plugin-webfont-dl'
+import VueMacros from 'vue-macros/vite'
+export function Plugins() {
+  const plugins: PluginOption[] = [
+    VueMacros({
+      plugins: {
+        vue: vue({ include: [/\.vue$/, /\.md$/] }),
+        vueJsx: vueJsx(),
+
+        // https://uvr.esm.is/guide/configuration.html
+        // https://github.com/posva/unplugin-vue-router
+        // ⚠️ Vue must be placed after VueRouter()
+        vueRouter: vueRouter({
+          exclude: ['**/__*', '**/__*/**/*'],
+          extensions: ['.page.vue', '.page.md'],
+          getRouteName: (routeNode) => getPascalCaseRouteName(routeNode),
+          logs: false,
+          routesFolder: 'src/pages',
+        }),
+      },
+    }),
+  ]
+
+  plugins.push(
+    // https://github.com/JohnCampionJr/vite-plugin-vue-layouts?tab=readme-ov-file#configuration
+    // Layouts({ defaultLayout: 'sakai-vue/AppLayout', pagesDirs: [] }),
+
+    // https://github.com/dishait/vite-plugin-vue-meta-layouts
+    MetaLayouts({
+      // defaultLayout: 'sakai-vue/AppLayout',
+      defaultLayout: 'naive-ui/AppLayout',
+      skipTopLevelRouteLayout: false, // 打开修复 https://github.com/JohnCampionJr/vite-plugin-vue-layouts/issues/134，默认为 false 关闭
+    }),
+  )
+
+  plugins.push(
+    // https://github.com/unplugin/unplugin-vue-markdown
+    Markdown({
+      headEnabled: true,
+    }),
+
+    cloudflare(),
+  )
+
+  plugins.push(
+    // https://github.com/antfu/unocss
+    // see uno.config.ts for config
+    UnoCSS(),
+  )
+
+  plugins.push(
+    // https://github.com/antfu/unplugin-auto-import
+    AutoImport({
+      // dirs: [
+      //   // 'src/composables',
+      //   'src/stores',
+      //   'src/utils',
+      // ],
+      imports: [
+        'vue',
+        'vue-i18n',
+        'pinia',
+        '@vueuse/core',
+        VueRouterAutoImports,
+        createUtils4uAutoImports([]),
+        {
+          'consola/browser': ['consola'],
+          'vue-router/auto': ['useLink'],
+          'naive-ui': ['useModal', 'useDialog', 'useMessage', 'useNotification', 'useLoadingBar'],
+        },
+      ],
+      vueTemplate: true,
+    }),
+
+    // https://github.com/antfu/unplugin-vue-components
+    Components({
+      // __开头的
+      excludeNames: [/^__/],
+      // allow auto load markdown components under `./src/components/`
+      extensions: ['vue', 'md'],
+      // allow auto import and register components used in markdown
+      include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
+      resolvers: [
+        AntDesignVueResolver({
+          importStyle: false, // css in js
+          resolveIcons: true,
+        }),
+        IconsResolver({
+          customCollections: ['svg'],
+          prefix: 'icon',
+        }), // https://github.com/unplugin/unplugin-icons?tab=readme-ov-file#auto-importing
+        TDesignResolver({ esm: true, library: 'mobile-vue' }),
+        VantResolver({ importStyle: true }),
+        PrimeVueResolver(/* { components: { prefix: 'P' } } */),
+        NaiveUiResolver(),
+      ],
+    }),
+
+    Icons({
+      autoInstall: true,
+      customCollections: {
+        svg: FileSystemIconLoader('src/assets/icons/svgs', (svg) => {
+          return svg.replace(/^<svg /, '<svg fill="currentColor" ')
+        }),
+      },
+      iconCustomizer(collection, icon, properties) {
+        properties.class = 'unplugin-icons'
+      },
+    }),
+
+    // https://github.com/intlify/bundle-tools/tree/main/packages/unplugin-vue-i18n
+    VueI18n({
+      /* options */
+      // locale messages resource pre-compile option
+      include: [path.resolve(import.meta.dirname, './src/locales/**')],
+
+      // https://github.com/intlify/bundle-tools/tree/main/packages/unplugin-vue-i18n#transformi18nblock
+      // transformI18nBlock(src) {
+      //   console.debug(`src :>> `, src);
+      //   console.debug(`typeof src :>> `, typeof src);
+      //   return src as string;
+      // },
+    }),
+  )
+
+  plugins.push(
+    // https://github.com/condorheroblog/vite-plugin-fake-server?tab=readme-ov-file#usage
+    vitePluginFakeServer({
+      basename: 'fake-api',
+      enableProd: !true,
+      include: 'fake',
+    }),
+  )
+
+  plugins.push(
+    vueDevTools(),
+    // https://vite-plugin-checker.netlify.app/introduction/introduction.html
+    checker({
+      eslint: {
+        lintCommand: 'eslint "./src/**/*.{js,jsx,ts,tsx,vue}"',
+        useFlatConfig: true,
+      },
+      vueTsc: true,
+      overlay: {
+        initialIsOpen: false,
+      },
+      terminal: true,
+      enableBuild: true,
+      // XXX: pnpm add vls vti -D
+    }),
+  )
+
+  plugins.push(
+    // https://github.com/FatehAK/vite-plugin-image-optimizer?tab=readme-ov-file#default-configuration
+    ViteImageOptimizer({
+      /* pass your config */
+    }),
+  )
+
+  // 检查是否在VS Code终端中运行
+  if (process.env.TERM_PROGRAM === 'vscode' || process.env.VSCODE_PID) {
+    // plugins.push(
+    //   // 构建后自动将dist目录打包成zip文件
+    //   viteArchiverPlugin({
+    //     addTimestamp: false, // 是否添加时间戳到输出文件名
+    //     format: 'zip', // 输出的压缩文件格式
+    //     outputDir: '', // 输出目录，默认为项目根目录
+    //     outputFileName: 'dist', // 输出的zip文件名（不含扩展名）
+    //     sourceDir: 'dist', // 要打包的源目录
+    //   }),
+    // )
+  }
+
+  const _unused = () => {
+    // plugins.push(
+    //   // https://github.com/rsnakdmx/vite-plugin-purgecss-v5?tab=readme-ov-file#-usage
+    //   pluginPurgeCss({
+    //     variables: true,
+    //   }),
+    //   viteSingleFile(),
+    //   viteStaticCopy({
+    //     targets: [
+    //       // globalThis.CESIUM_BASE_URL = 'https://digitalarsenal.io/';
+    //       { dest: cesiumBaseUrl, src: `${cesiumSource}/ThirdParty` },
+    //       { dest: cesiumBaseUrl, src: `${cesiumSource}/Workers` },
+    //       { dest: cesiumBaseUrl, src: `${cesiumSource}/Assets` },
+    //       { dest: cesiumBaseUrl, src: `${cesiumSource}/Widgets` },
+    //     ],
+    //   }),
+    // )
+    plugins.push(
+      // https://github.com/feat-agency/vite-plugin-webfont-dl?tab=readme-ov-file#-usage-simple-config-method-b-
+      ViteWebfontDownload([
+        'https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap',
+        'https://fonts.googleapis.com/css2?family=Fira+Code&display=swap',
+        'https://fonts.googleapis.com/css?family=Montserrat:300,400,500,600,700,900',
+      ]),
+    )
+  }
+
+  return plugins
+}
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -1,18 +1,110 @@
 import { fileURLToPath, URL } from 'node:url'

-import { defineConfig } from 'vite'
-import vue from '@vitejs/plugin-vue'
-import vueJsx from '@vitejs/plugin-vue-jsx'
-import vueDevTools from 'vite-plugin-vue-devtools'
+import { defineConfig, type DepOptimizationOptions } from 'vite'

-import { cloudflare } from '@cloudflare/vite-plugin'
+import { createViteProxy } from 'utils4u/vite'
+import path from 'node:path'
+
+import { Plugins } from './vite.config.plugins'
+
+function formatFilename(id: string, prefix: string) {
+  const filename = path
+    .basename(id)
+    .split('?')[0]
+    .replace(/\.\w+$/, '')
+  return `${prefix}/${filename}`
+}
+function isInNodeModules(id: string) {
+  return id.includes('node_modules')
+}

 // https://vite.dev/config/
-export default defineConfig({
-  plugins: [vue(), vueJsx(), vueDevTools(), cloudflare()],
+export default defineConfig(({ command /* mode */ }) => {
+  const isBuild = command === 'build'
+  // const env = loadEnv(mode, process.cwd())
+
+  return {
+    build: {
+      rolldownOptions: {
+        output: {
+          advancedChunks: {
+            groups: [
+              {
+                name: (moduleId) => (moduleId.includes('node_modules') ? 'libss' : 'app'),
+                // minSize: 100 * 1024,
+              },
+              {
+                name: 'libs',
+                test: /node_modules/,
+              },
+              // {
+              //   name: 'vue',
+              //   test: /node_modules[\\/]vue/,
+              // },
+              // {
+              //   name(moduleId, _ctx) {
+              //     if (isInNodeModules(moduleId)) {
+              //       let pkgName = moduleId
+              //       pkgName = pkgName.split('.pnpm/')?.[1] || pkgName
+              //       pkgName = pkgName.split('node_modules/')?.[1] || pkgName
+              //       pkgName = pkgName.startsWith('@')
+              //         ? pkgName.split('/')[0] + '/' + pkgName.split('/')[1]
+              //         : pkgName.split('/')[0]
+              //       if (pkgName.startsWith('@vue/')) pkgName = 'vue'
+              //       return `libs/${pkgName}`;
+              //     }
+              //   },
+              // },
+            ],
+          },
+        },
+      },
+    },
+    //  base: env.VITE_BASE,
+    plugins: Plugins(),
    resolve: {
      alias: {
        '@': fileURLToPath(new URL('./src', import.meta.url)),
      },
    },
+    define: {
+      __DEV__: JSON.stringify(!isBuild),
+    },
+    server: {
+      allowedHosts: ['.nwct.dev'],
+      proxy: createViteProxy(),
+    },
+    optimizeDeps: optimizeDeps(),
+  }
 })
+
+// const primevuecomponents = await (async () => {
+//   const { components } = await import('@primevue/metadata')
+//   return components.map((c) => c.from).filter((c) => c !== undefined)
+// })()
+function optimizeDeps(): DepOptimizationOptions {
+  return {
+    include: [
+      // ...primevuecomponents,
+      '@primeuix/themes',
+      '@primeuix/themes/lara',
+      'class-variance-authority',
+      'clsx',
+      'tailwind-merge',
+      'reka-ui',
+      'axios',
+      '@ant-design/icons-vue',
+      'ant-design-vue/es',
+      'p5',
+      '@splinetool/runtime',
+      'satellite.js',
+      'ts-enum-util',
+      'unplugin-vue-router',
+      'unplugin-vue-router/runtime',
+      'unplugin-vue-router/data-loaders/basic',
+      'unplugin-vue-router/data-loaders/pinia-colada',
+      'eruda',
+    ],
+    exclude: ['quill', 'chart.js/auto'],
+  }
+}