Initial commit

.gitignore

@@ -0,0 +1,9 @@
+.DS_Store
+.vite-ssg-dist
+.vite-ssg-temp
+*.local
+dist
+dist-ssr
+node_modules
+.idea/
+*.log

.npmrc

@@ -0,0 +1 @@
+shamefully-hoist=true

LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020-PRESENT Anthony Fu
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

README.md

@@ -0,0 +1,87 @@
+<p align='center'>
+  <img src='https://user-images.githubusercontent.com/11247099/111864893-a457fd00-899e-11eb-9f05-f4b88987541d.png' alt='Vitesse - Opinionated Vite Starter Template' width='600'/>
+</p>
+
+<h6 align='center'>
+<a href="https://vitesse-lite.netlify.app/">Live Demo</a>
+</h6>
+
+<h5 align='center'>
+<b>Lightweight version of <a href="https://github.com/antfu/vitesse">Vitesse</a></b>
+</h5>
+
+<br>
+
+<p align='center'>
+<b>English</b> | <a href="https://github.com/antfu/vitesse-lite/blob/main/README.zh-CN.md">简体中文</a>
+<!-- Contributors: Thanks for geting interested, however we DON'T accept new transitions to the README, thanks. -->
+</p>
+
+## Features
+
+- ⚡️ [Vue 3](https://github.com/vuejs/vue-next), [Vite 2](https://github.com/vitejs/vite), [pnpm](https://pnpm.js.org/), [ESBuild](https://github.com/evanw/esbuild) - born with fastness
+
+- 🗂 [File based routing](./src/pages)
+
+- 📦 [Components auto importing](./src/components)
+
+- 🎨 [UnoCSS](https://github.com/antfu/unocss) - The instant on-demand atomic CSS engine.
+
+- 😃 Use icons from any icon sets in [Pure CSS](https://github.com/antfu/unocss/tree/main/packages/preset-icons)
+
+- 🔥 Use the [new `<script setup>` style](https://github.com/vuejs/rfcs/pull/227)
+
+- ✅ Use [Vitest](http://vitest.dev/) for unit and components testing
+
+- 🦾 TypeScript, of course
+
+- ☁️ Deploy on Netlify, zero-config
+
+
+<br>
+
+See [Vitesse](https://github.com/antfu/vitesse) for full featureset.
+
+
+## Dropped Features from [Vitesse](https://github.com/antfu/vitesse)
+
+- ~~i18n~~
+- ~~Layouts~~
+- ~~SSG~~
+- ~~PWA~~
+- ~~Markdown~~
+
+## Pre-packed
+
+### UI Frameworks
+
+- [UnoCSS](https://github.com/antfu/unocss) - The instant on-demand atomic CSS engine.
+
+### Icons
+
+- [Iconify](https://iconify.design) - use icons from any icon sets [🔍Icônes](https://icones.netlify.app/)
+- [Pure CSS Icons via UnoCSS](https://github.com/antfu/unocss/tree/main/packages/preset-icons)
+
+### Plugins
+
+- [Vue Router](https://github.com/vuejs/vue-router)
+  - [`vite-plugin-pages`](https://github.com/hannoeru/vite-plugin-pages) - file system based routing
+- [`unplugin-auto-import`](https://github.com/antfu/unplugin-auto-import) - Directly use Vue Composition API and others without importing
+- [`unplugin-vue-components`](https://github.com/antfu/unplugin-vue-components) - components auto import
+- [VueUse](https://github.com/antfu/vueuse) - collection of useful composition APIs
+
+## Try it now!
+
+### GitHub Template
+
+[Create a repo from this template on GitHub](https://github.com/antfu/vitesse-lite/generate).
+
+### Clone to local
+
+If you prefer to do it manually with the cleaner git history
+
+```bash
+npx degit antfu/vitesse-lite my-vitesse-app
+cd my-vitesse-app
+pnpm i # If you don't have pnpm installed, run: npm install -g pnpm
+```

auto-imports.d.ts

@@ -0,0 +1,497 @@
+// Generated by 'unplugin-auto-import'
+export {}
+declare global {
+  const $$: typeof import('vue/macros')['$$']
+  const $: typeof import('vue/macros')['$']
+  const $computed: typeof import('vue/macros')['$computed']
+  const $customRef: typeof import('vue/macros')['$customRef']
+  const $ref: typeof import('vue/macros')['$ref']
+  const $shallowRef: typeof import('vue/macros')['$shallowRef']
+  const $toRef: typeof import('vue/macros')['$toRef']
+  const EffectScope: typeof import('vue')['EffectScope']
+  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 controlledComputed: typeof import('@vueuse/core')['controlledComputed']
+  const controlledRef: typeof import('@vueuse/core')['controlledRef']
+  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 createReactiveFn: typeof import('@vueuse/core')['createReactiveFn']
+  const createSharedComposable: typeof import('@vueuse/core')['createSharedComposable']
+  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 defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
+  const defineComponent: typeof import('vue')['defineComponent']
+  const eagerComputed: typeof import('@vueuse/core')['eagerComputed']
+  const effectScope: typeof import('vue')['effectScope']
+  const extendRef: typeof import('@vueuse/core')['extendRef']
+  const getCurrentInstance: typeof import('vue')['getCurrentInstance']
+  const getCurrentScope: typeof import('vue')['getCurrentScope']
+  const h: typeof import('vue')['h']
+  const ignorableWatch: typeof import('@vueuse/core')['ignorableWatch']
+  const inject: typeof import('vue')['inject']
+  const isDark: typeof import('./src/composables/dark')['isDark']
+  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 logicAnd: typeof import('@vueuse/core')['logicAnd']
+  const logicNot: typeof import('@vueuse/core')['logicNot']
+  const logicOr: typeof import('@vueuse/core')['logicOr']
+  const makeDestructurable: typeof import('@vueuse/core')['makeDestructurable']
+  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 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 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 pausableWatch: typeof import('@vueuse/core')['pausableWatch']
+  const provide: typeof import('vue')['provide']
+  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 shallowReactive: typeof import('vue')['shallowReactive']
+  const shallowReadonly: typeof import('vue')['shallowReadonly']
+  const shallowRef: typeof import('vue')['shallowRef']
+  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 toggleDark: typeof import('./src/composables/dark')['toggleDark']
+  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 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 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 useClamp: typeof import('@vueuse/core')['useClamp']
+  const useClipboard: typeof import('@vueuse/core')['useClipboard']
+  const useColorMode: typeof import('@vueuse/core')['useColorMode']
+  const useConfirmDialog: typeof import('@vueuse/core')['useConfirmDialog']
+  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 useDisplayMedia: typeof import('@vueuse/core')['useDisplayMedia']
+  const useDocumentVisibility: typeof import('@vueuse/core')['useDocumentVisibility']
+  const useDraggable: typeof import('@vueuse/core')['useDraggable']
+  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 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 useIdle: typeof import('@vueuse/core')['useIdle']
+  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 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 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 useNow: typeof import('@vueuse/core')['useNow']
+  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 usePermission: typeof import('@vueuse/core')['usePermission']
+  const usePointer: typeof import('@vueuse/core')['usePointer']
+  const usePointerSwipe: typeof import('@vueuse/core')['usePointerSwipe']
+  const usePreferredColorScheme: typeof import('@vueuse/core')['usePreferredColorScheme']
+  const usePreferredDark: typeof import('@vueuse/core')['usePreferredDark']
+  const usePreferredLanguages: typeof import('@vueuse/core')['usePreferredLanguages']
+  const useRafFn: typeof import('@vueuse/core')['useRafFn']
+  const useRefHistory: typeof import('@vueuse/core')['useRefHistory']
+  const useResizeObserver: typeof import('@vueuse/core')['useResizeObserver']
+  const useRoute: typeof import('vue-router')['useRoute']
+  const useRouter: typeof import('vue-router')['useRouter']
+  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 useSpeechRecognition: typeof import('@vueuse/core')['useSpeechRecognition']
+  const useSpeechSynthesis: typeof import('@vueuse/core')['useSpeechSynthesis']
+  const useStorage: typeof import('@vueuse/core')['useStorage']
+  const useStorageAsync: typeof import('@vueuse/core')['useStorageAsync']
+  const useStyleTag: typeof import('@vueuse/core')['useStyleTag']
+  const useSwipe: typeof import('@vueuse/core')['useSwipe']
+  const useTemplateRefsList: typeof import('@vueuse/core')['useTemplateRefsList']
+  const useTextSelection: typeof import('@vueuse/core')['useTextSelection']
+  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 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 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 watchAtMost: typeof import('@vueuse/core')['watchAtMost']
+  const watchDebounced: typeof import('@vueuse/core')['watchDebounced']
+  const watchEffect: typeof import('vue')['watchEffect']
+  const watchIgnorable: typeof import('@vueuse/core')['watchIgnorable']
+  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 watchWithFilter: typeof import('@vueuse/core')['watchWithFilter']
+  const whenever: typeof import('@vueuse/core')['whenever']
+}
+// for vue template auto import
+declare module 'vue' {
+  interface ComponentCustomProperties {
+    $$: typeof import('vue/macros')['$$']
+    $: typeof import('vue/macros')['$']
+    $computed: typeof import('vue/macros')['$computed']
+    $customRef: typeof import('vue/macros')['$customRef']
+    $ref: typeof import('vue/macros')['$ref']
+    $shallowRef: typeof import('vue/macros')['$shallowRef']
+    $toRef: typeof import('vue/macros')['$toRef']
+    EffectScope: typeof import('vue')['EffectScope']
+    asyncComputed: typeof import('@vueuse/core')['asyncComputed']
+    autoResetRef: typeof import('@vueuse/core')['autoResetRef']
+    computed: typeof import('vue')['computed']
+    computedAsync: typeof import('@vueuse/core')['computedAsync']
+    computedEager: typeof import('@vueuse/core')['computedEager']
+    computedInject: typeof import('@vueuse/core')['computedInject']
+    computedWithControl: typeof import('@vueuse/core')['computedWithControl']
+    controlledComputed: typeof import('@vueuse/core')['controlledComputed']
+    controlledRef: typeof import('@vueuse/core')['controlledRef']
+    createApp: typeof import('vue')['createApp']
+    createEventHook: typeof import('@vueuse/core')['createEventHook']
+    createGlobalState: typeof import('@vueuse/core')['createGlobalState']
+    createInjectionState: typeof import('@vueuse/core')['createInjectionState']
+    createReactiveFn: typeof import('@vueuse/core')['createReactiveFn']
+    createSharedComposable: typeof import('@vueuse/core')['createSharedComposable']
+    createUnrefFn: typeof import('@vueuse/core')['createUnrefFn']
+    customRef: typeof import('vue')['customRef']
+    debouncedRef: typeof import('@vueuse/core')['debouncedRef']
+    debouncedWatch: typeof import('@vueuse/core')['debouncedWatch']
+    defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
+    defineComponent: typeof import('vue')['defineComponent']
+    eagerComputed: typeof import('@vueuse/core')['eagerComputed']
+    effectScope: typeof import('vue')['effectScope']
+    extendRef: typeof import('@vueuse/core')['extendRef']
+    getCurrentInstance: typeof import('vue')['getCurrentInstance']
+    getCurrentScope: typeof import('vue')['getCurrentScope']
+    h: typeof import('vue')['h']
+    ignorableWatch: typeof import('@vueuse/core')['ignorableWatch']
+    inject: typeof import('vue')['inject']
+    isDark: typeof import('./src/composables/dark')['isDark']
+    isDefined: typeof import('@vueuse/core')['isDefined']
+    isProxy: typeof import('vue')['isProxy']
+    isReactive: typeof import('vue')['isReactive']
+    isReadonly: typeof import('vue')['isReadonly']
+    isRef: typeof import('vue')['isRef']
+    logicAnd: typeof import('@vueuse/core')['logicAnd']
+    logicNot: typeof import('@vueuse/core')['logicNot']
+    logicOr: typeof import('@vueuse/core')['logicOr']
+    makeDestructurable: typeof import('@vueuse/core')['makeDestructurable']
+    markRaw: typeof import('vue')['markRaw']
+    nextTick: typeof import('vue')['nextTick']
+    onActivated: typeof import('vue')['onActivated']
+    onBeforeMount: typeof import('vue')['onBeforeMount']
+    onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
+    onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
+    onClickOutside: typeof import('@vueuse/core')['onClickOutside']
+    onDeactivated: typeof import('vue')['onDeactivated']
+    onErrorCaptured: typeof import('vue')['onErrorCaptured']
+    onKeyStroke: typeof import('@vueuse/core')['onKeyStroke']
+    onLongPress: typeof import('@vueuse/core')['onLongPress']
+    onMounted: typeof import('vue')['onMounted']
+    onRenderTracked: typeof import('vue')['onRenderTracked']
+    onRenderTriggered: typeof import('vue')['onRenderTriggered']
+    onScopeDispose: typeof import('vue')['onScopeDispose']
+    onServerPrefetch: typeof import('vue')['onServerPrefetch']
+    onStartTyping: typeof import('@vueuse/core')['onStartTyping']
+    onUnmounted: typeof import('vue')['onUnmounted']
+    onUpdated: typeof import('vue')['onUpdated']
+    pausableWatch: typeof import('@vueuse/core')['pausableWatch']
+    provide: typeof import('vue')['provide']
+    reactify: typeof import('@vueuse/core')['reactify']
+    reactifyObject: typeof import('@vueuse/core')['reactifyObject']
+    reactive: typeof import('vue')['reactive']
+    reactiveComputed: typeof import('@vueuse/core')['reactiveComputed']
+    reactiveOmit: typeof import('@vueuse/core')['reactiveOmit']
+    reactivePick: typeof import('@vueuse/core')['reactivePick']
+    readonly: typeof import('vue')['readonly']
+    ref: typeof import('vue')['ref']
+    refAutoReset: typeof import('@vueuse/core')['refAutoReset']
+    refDebounced: typeof import('@vueuse/core')['refDebounced']
+    refDefault: typeof import('@vueuse/core')['refDefault']
+    refThrottled: typeof import('@vueuse/core')['refThrottled']
+    refWithControl: typeof import('@vueuse/core')['refWithControl']
+    resolveComponent: typeof import('vue')['resolveComponent']
+    shallowReactive: typeof import('vue')['shallowReactive']
+    shallowReadonly: typeof import('vue')['shallowReadonly']
+    shallowRef: typeof import('vue')['shallowRef']
+    syncRef: typeof import('@vueuse/core')['syncRef']
+    syncRefs: typeof import('@vueuse/core')['syncRefs']
+    templateRef: typeof import('@vueuse/core')['templateRef']
+    throttledRef: typeof import('@vueuse/core')['throttledRef']
+    throttledWatch: typeof import('@vueuse/core')['throttledWatch']
+    toRaw: typeof import('vue')['toRaw']
+    toReactive: typeof import('@vueuse/core')['toReactive']
+    toRef: typeof import('vue')['toRef']
+    toRefs: typeof import('vue')['toRefs']
+    toggleDark: typeof import('./src/composables/dark')['toggleDark']
+    triggerRef: typeof import('vue')['triggerRef']
+    tryOnBeforeMount: typeof import('@vueuse/core')['tryOnBeforeMount']
+    tryOnBeforeUnmount: typeof import('@vueuse/core')['tryOnBeforeUnmount']
+    tryOnMounted: typeof import('@vueuse/core')['tryOnMounted']
+    tryOnScopeDispose: typeof import('@vueuse/core')['tryOnScopeDispose']
+    tryOnUnmounted: typeof import('@vueuse/core')['tryOnUnmounted']
+    unref: typeof import('vue')['unref']
+    unrefElement: typeof import('@vueuse/core')['unrefElement']
+    until: typeof import('@vueuse/core')['until']
+    useActiveElement: typeof import('@vueuse/core')['useActiveElement']
+    useAsyncQueue: typeof import('@vueuse/core')['useAsyncQueue']
+    useAsyncState: typeof import('@vueuse/core')['useAsyncState']
+    useAttrs: typeof import('vue')['useAttrs']
+    useBase64: typeof import('@vueuse/core')['useBase64']
+    useBattery: typeof import('@vueuse/core')['useBattery']
+    useBreakpoints: typeof import('@vueuse/core')['useBreakpoints']
+    useBroadcastChannel: typeof import('@vueuse/core')['useBroadcastChannel']
+    useBrowserLocation: typeof import('@vueuse/core')['useBrowserLocation']
+    useCached: typeof import('@vueuse/core')['useCached']
+    useClamp: typeof import('@vueuse/core')['useClamp']
+    useClipboard: typeof import('@vueuse/core')['useClipboard']
+    useColorMode: typeof import('@vueuse/core')['useColorMode']
+    useConfirmDialog: typeof import('@vueuse/core')['useConfirmDialog']
+    useCounter: typeof import('@vueuse/core')['useCounter']
+    useCssModule: typeof import('vue')['useCssModule']
+    useCssVar: typeof import('@vueuse/core')['useCssVar']
+    useCssVars: typeof import('vue')['useCssVars']
+    useCurrentElement: typeof import('@vueuse/core')['useCurrentElement']
+    useCycleList: typeof import('@vueuse/core')['useCycleList']
+    useDark: typeof import('@vueuse/core')['useDark']
+    useDateFormat: typeof import('@vueuse/core')['useDateFormat']
+    useDebounce: typeof import('@vueuse/core')['useDebounce']
+    useDebounceFn: typeof import('@vueuse/core')['useDebounceFn']
+    useDebouncedRefHistory: typeof import('@vueuse/core')['useDebouncedRefHistory']
+    useDeviceMotion: typeof import('@vueuse/core')['useDeviceMotion']
+    useDeviceOrientation: typeof import('@vueuse/core')['useDeviceOrientation']
+    useDevicePixelRatio: typeof import('@vueuse/core')['useDevicePixelRatio']
+    useDevicesList: typeof import('@vueuse/core')['useDevicesList']
+    useDisplayMedia: typeof import('@vueuse/core')['useDisplayMedia']
+    useDocumentVisibility: typeof import('@vueuse/core')['useDocumentVisibility']
+    useDraggable: typeof import('@vueuse/core')['useDraggable']
+    useElementBounding: typeof import('@vueuse/core')['useElementBounding']
+    useElementByPoint: typeof import('@vueuse/core')['useElementByPoint']
+    useElementHover: typeof import('@vueuse/core')['useElementHover']
+    useElementSize: typeof import('@vueuse/core')['useElementSize']
+    useElementVisibility: typeof import('@vueuse/core')['useElementVisibility']
+    useEventBus: typeof import('@vueuse/core')['useEventBus']
+    useEventListener: typeof import('@vueuse/core')['useEventListener']
+    useEventSource: typeof import('@vueuse/core')['useEventSource']
+    useEyeDropper: typeof import('@vueuse/core')['useEyeDropper']
+    useFavicon: typeof import('@vueuse/core')['useFavicon']
+    useFetch: typeof import('@vueuse/core')['useFetch']
+    useFileSystemAccess: typeof import('@vueuse/core')['useFileSystemAccess']
+    useFocus: typeof import('@vueuse/core')['useFocus']
+    useFocusWithin: typeof import('@vueuse/core')['useFocusWithin']
+    useFps: typeof import('@vueuse/core')['useFps']
+    useFullscreen: typeof import('@vueuse/core')['useFullscreen']
+    useGamepad: typeof import('@vueuse/core')['useGamepad']
+    useGeolocation: typeof import('@vueuse/core')['useGeolocation']
+    useIdle: typeof import('@vueuse/core')['useIdle']
+    useInfiniteScroll: typeof import('@vueuse/core')['useInfiniteScroll']
+    useIntersectionObserver: typeof import('@vueuse/core')['useIntersectionObserver']
+    useInterval: typeof import('@vueuse/core')['useInterval']
+    useIntervalFn: typeof import('@vueuse/core')['useIntervalFn']
+    useKeyModifier: typeof import('@vueuse/core')['useKeyModifier']
+    useLastChanged: typeof import('@vueuse/core')['useLastChanged']
+    useLocalStorage: typeof import('@vueuse/core')['useLocalStorage']
+    useMagicKeys: typeof import('@vueuse/core')['useMagicKeys']
+    useManualRefHistory: typeof import('@vueuse/core')['useManualRefHistory']
+    useMediaControls: typeof import('@vueuse/core')['useMediaControls']
+    useMediaQuery: typeof import('@vueuse/core')['useMediaQuery']
+    useMemoize: typeof import('@vueuse/core')['useMemoize']
+    useMemory: typeof import('@vueuse/core')['useMemory']
+    useMounted: typeof import('@vueuse/core')['useMounted']
+    useMouse: typeof import('@vueuse/core')['useMouse']
+    useMouseInElement: typeof import('@vueuse/core')['useMouseInElement']
+    useMousePressed: typeof import('@vueuse/core')['useMousePressed']
+    useMutationObserver: typeof import('@vueuse/core')['useMutationObserver']
+    useNavigatorLanguage: typeof import('@vueuse/core')['useNavigatorLanguage']
+    useNetwork: typeof import('@vueuse/core')['useNetwork']
+    useNow: typeof import('@vueuse/core')['useNow']
+    useOffsetPagination: typeof import('@vueuse/core')['useOffsetPagination']
+    useOnline: typeof import('@vueuse/core')['useOnline']
+    usePageLeave: typeof import('@vueuse/core')['usePageLeave']
+    useParallax: typeof import('@vueuse/core')['useParallax']
+    usePermission: typeof import('@vueuse/core')['usePermission']
+    usePointer: typeof import('@vueuse/core')['usePointer']
+    usePointerSwipe: typeof import('@vueuse/core')['usePointerSwipe']
+    usePreferredColorScheme: typeof import('@vueuse/core')['usePreferredColorScheme']
+    usePreferredDark: typeof import('@vueuse/core')['usePreferredDark']
+    usePreferredLanguages: typeof import('@vueuse/core')['usePreferredLanguages']
+    useRafFn: typeof import('@vueuse/core')['useRafFn']
+    useRefHistory: typeof import('@vueuse/core')['useRefHistory']
+    useResizeObserver: typeof import('@vueuse/core')['useResizeObserver']
+    useRoute: typeof import('vue-router')['useRoute']
+    useRouter: typeof import('vue-router')['useRouter']
+    useScreenOrientation: typeof import('@vueuse/core')['useScreenOrientation']
+    useScreenSafeArea: typeof import('@vueuse/core')['useScreenSafeArea']
+    useScriptTag: typeof import('@vueuse/core')['useScriptTag']
+    useScroll: typeof import('@vueuse/core')['useScroll']
+    useScrollLock: typeof import('@vueuse/core')['useScrollLock']
+    useSessionStorage: typeof import('@vueuse/core')['useSessionStorage']
+    useShare: typeof import('@vueuse/core')['useShare']
+    useSlots: typeof import('vue')['useSlots']
+    useSpeechRecognition: typeof import('@vueuse/core')['useSpeechRecognition']
+    useSpeechSynthesis: typeof import('@vueuse/core')['useSpeechSynthesis']
+    useStorage: typeof import('@vueuse/core')['useStorage']
+    useStorageAsync: typeof import('@vueuse/core')['useStorageAsync']
+    useStyleTag: typeof import('@vueuse/core')['useStyleTag']
+    useSwipe: typeof import('@vueuse/core')['useSwipe']
+    useTemplateRefsList: typeof import('@vueuse/core')['useTemplateRefsList']
+    useTextSelection: typeof import('@vueuse/core')['useTextSelection']
+    useThrottle: typeof import('@vueuse/core')['useThrottle']
+    useThrottleFn: typeof import('@vueuse/core')['useThrottleFn']
+    useThrottledRefHistory: typeof import('@vueuse/core')['useThrottledRefHistory']
+    useTimeAgo: typeof import('@vueuse/core')['useTimeAgo']
+    useTimeout: typeof import('@vueuse/core')['useTimeout']
+    useTimeoutFn: typeof import('@vueuse/core')['useTimeoutFn']
+    useTimeoutPoll: typeof import('@vueuse/core')['useTimeoutPoll']
+    useTimestamp: typeof import('@vueuse/core')['useTimestamp']
+    useTitle: typeof import('@vueuse/core')['useTitle']
+    useToggle: typeof import('@vueuse/core')['useToggle']
+    useTransition: typeof import('@vueuse/core')['useTransition']
+    useUrlSearchParams: typeof import('@vueuse/core')['useUrlSearchParams']
+    useUserMedia: typeof import('@vueuse/core')['useUserMedia']
+    useVModel: typeof import('@vueuse/core')['useVModel']
+    useVModels: typeof import('@vueuse/core')['useVModels']
+    useVibrate: typeof import('@vueuse/core')['useVibrate']
+    useVirtualList: typeof import('@vueuse/core')['useVirtualList']
+    useWakeLock: typeof import('@vueuse/core')['useWakeLock']
+    useWebNotification: typeof import('@vueuse/core')['useWebNotification']
+    useWebSocket: typeof import('@vueuse/core')['useWebSocket']
+    useWebWorker: typeof import('@vueuse/core')['useWebWorker']
+    useWebWorkerFn: typeof import('@vueuse/core')['useWebWorkerFn']
+    useWindowFocus: typeof import('@vueuse/core')['useWindowFocus']
+    useWindowScroll: typeof import('@vueuse/core')['useWindowScroll']
+    useWindowSize: typeof import('@vueuse/core')['useWindowSize']
+    watch: typeof import('vue')['watch']
+    watchAtMost: typeof import('@vueuse/core')['watchAtMost']
+    watchDebounced: typeof import('@vueuse/core')['watchDebounced']
+    watchEffect: typeof import('vue')['watchEffect']
+    watchIgnorable: typeof import('@vueuse/core')['watchIgnorable']
+    watchOnce: typeof import('@vueuse/core')['watchOnce']
+    watchPausable: typeof import('@vueuse/core')['watchPausable']
+    watchPostEffect: typeof import('vue')['watchPostEffect']
+    watchSyncEffect: typeof import('vue')['watchSyncEffect']
+    watchThrottled: typeof import('@vueuse/core')['watchThrottled']
+    watchWithFilter: typeof import('@vueuse/core')['watchWithFilter']
+    whenever: typeof import('@vueuse/core')['whenever']
+  }
+}

components.d.ts

@@ -0,0 +1,13 @@
+// generated by unplugin-vue-components
+// We suggest you to commit this file into source control
+// Read more: https://github.com/vuejs/vue-next/pull/3399
+import '@vue/runtime-core'
+
+declare module '@vue/runtime-core' {
+  export interface GlobalComponents {
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
+  }
+}
+
+export {}

index.html

@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="icon" href="/favicon.svg" type="image/svg+xml">
+  <title>Maintenance</title>
+  <meta name="description" content="Opinionated Vite Starter Template">
+</head>
+<body class="font-sans dark:text-white dark:bg-hex-121212">
+  <div id="app"></div>
+  <script>
+    (function () {
+      const prefersDark = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
+      const setting = localStorage.getItem('color-schema') || 'auto'
+      if (setting === 'dark' || (prefersDark && setting !== 'light'))
+        document.documentElement.classList.toggle('dark', true)
+    })()
+  </script>
+  <script type="module" src="/src/main.ts"></script>
+</body>
+</html>

locales/en.json

@@ -0,0 +1,10 @@
+{
+  "maintenance": "⚠️ Services under maintenance ⚠️",
+  "maintenance_reason": "We'll be back soon. Please check back later.",
+  "maintenance_description": "Sorry for the inconvenience but we're performing some maintenance at the moment. We'll be back online shortly! If you need to you can always contact us.",
+  "team": "- The ArtDanjProduction Team",
+
+  "error": "❌ Service not found ❌",
+  "error_reason": "The service you are looking for does not exist.",
+  "error_description": "Please check the URL or try again later. If you continue to experience issues, please contact us."
+}

locales/fr.json

@@ -0,0 +1,10 @@
+{
+  "maintenance": "⚠️ Services en maintenance ⚠️",
+  "maintenance_reason": "Nous reviendrons bientôt. Veuillez revenir plus tard.",
+  "maintenance_description": "Désolé pour la gêne occasionnée, mais nous effectuons actuellement une maintenance. Nous serons bientôt de retour en ligne ! Si vous en avez besoin, vous pouvez toujours nous contacter.",
+  "team": "- L'équipe ArtDanjProduction",
+
+  "error": "❌ Service introuvable ❌",
+  "error_reason": "Le service que vous recherchez n'existe pas.",
+  "error_description": "Veuillez vérifier l'URL ou réessayer plus tard. Si vous continuez à rencontrer des problèmes, veuillez nous contacter."
+}

package.json

@@ -0,0 +1,37 @@
+{
+  "private": true,
+  "packageManager": "pnpm@7.1.5",
+  "scripts": {
+    "build": "vite build",
+    "dev": "vite --port 3333 --open",
+    "lint": "eslint .",
+    "typecheck": "vue-tsc --noEmit",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@vueuse/core": "^8.5.0",
+    "vue": "^3.2.36",
+    "vue-i18n": "^9.1.10",
+    "vue-router": "^4.0.15"
+  },
+  "devDependencies": {
+    "@antfu/eslint-config": "^0.24.1",
+    "@iconify-json/carbon": "^1.1.5",
+    "@intlify/vite-plugin-vue-i18n": "^3.4.0",
+    "@types/node": "^17.0.35",
+    "@vitejs/plugin-vue": "^2.3.3",
+    "@vue/test-utils": "^2.0.0",
+    "eslint": "^8.16.0",
+    "typescript": "^4.7.2",
+    "unplugin-auto-import": "^0.8.4",
+    "unplugin-vue-components": "^0.19.5",
+    "vite": "^2.9.9",
+    "vite-plugin-pages": "^0.23.0",
+    "vite-plugin-windicss": "^1.8.4",
+    "vue-tsc": "^0.34.16",
+    "windicss": "^3.5.4"
+  },
+  "eslintConfig": {
+    "extends": "@antfu"
+  }
+}

public/favicon.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
+  <style>
+    path { fill: #222; }
+    @media (prefers-color-scheme: dark) {
+      path { fill: #ffffff; }
+    }
+  </style>
+  <path d="M27.562 26L17.17 8.928l2.366-3.888L17.828 4L16 7.005L14.17 4l-1.708 1.04l2.366 3.888L4.438 26H2v2h28v-2zM16 10.85L25.22 26H17v-8h-2v8H6.78z" />
+</svg>

shims.d.ts

@@ -0,0 +1,5 @@
+declare module '*.vue' {
+  import type { DefineComponent } from 'vue'
+  const component: DefineComponent<{}, {}, any>
+  export default component
+}

src/App.vue

@@ -0,0 +1,14 @@
+<script setup lang="ts">
+import { useI18n } from 'vue-i18n'
+
+const { t } = useI18n()
+
+const title = useTitle()
+title.value = t('title')
+</script>
+
+<template>
+  <main class="h-full w-full flex items-center justify-center">
+    <router-view />
+  </main>
+</template>

src/composables/dark.ts

@@ -0,0 +1,2 @@
+export const isDark = useDark()
+export const toggleDark = useToggle(isDark)

src/composables/index.ts

@@ -0,0 +1 @@
+export * from './dark'

src/main.ts

@@ -0,0 +1,34 @@
+import { createApp } from 'vue'
+import { createRouter, createWebHistory } from 'vue-router'
+import { createI18n } from 'vue-i18n'
+import routes from 'virtual:generated-pages'
+import App from './App.vue'
+
+import './styles/main.css'
+import 'virtual:windi.css'
+
+const app = createApp(App)
+const router = createRouter({
+  history: createWebHistory(import.meta.env.BASE_URL),
+  routes,
+})
+app.use(router)
+
+const messages = Object.fromEntries(
+  Object.entries(
+    import.meta.globEager('../locales/*.json'))
+    .map(([key, value]) => {
+      return [key.slice(11, -5), value.default]
+    }),
+)
+
+const i18n = createI18n({
+  legacy: false,
+  locale: 'en',
+  messages,
+  fallbackLocale: 'en',
+})
+
+app.use(i18n)
+
+app.mount('#app')

src/pages/index.vue

@@ -0,0 +1,22 @@
+<script setup lang="ts">
+import { useI18n } from 'vue-i18n'
+
+const { t } = useI18n()
+
+const title = useTitle()
+title.value = t('error')
+</script>
+
+<template>
+  <section class="w-2/3 text-justify">
+    <h1 class="text-5xl font-black">
+      {{ t('error_reason') }}
+    </h1>
+    <h3 class="text-3xl my-4">
+      {{ t('error_description') }}
+    </h3>
+    <p class="text-xl text-gray-300">
+      {{ t('team') }}
+    </p>
+  </section>
+</template>

src/pages/maintenance.vue

@@ -0,0 +1,22 @@
+<script setup lang="ts">
+import { useI18n } from 'vue-i18n'
+
+const { t } = useI18n()
+
+const title = useTitle()
+title.value = t('maintenance')
+</script>
+
+<template>
+  <section class="w-2/3 text-justify">
+    <h1 class="text-5xl font-black">
+      {{ t('maintenance_reason') }}
+    </h1>
+    <h3 class="text-3xl my-4">
+      {{ t('maintenance_description') }}
+    </h3>
+    <p class="text-xl text-gray-300">
+      {{ t('team') }}
+    </p>
+  </section>
+</template>

src/styles/main.css

@@ -0,0 +1,14 @@
+@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@400;700&display=swap');
+
+html,
+body,
+#app {
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  font-family: 'Raleway', sans-serif;
+}
+
+html.dark {
+  background: #121212;
+}

tsconfig.json

@@ -0,0 +1,25 @@
+{
+  "compilerOptions": {
+    "baseUrl": ".",
+    "module": "ESNext",
+    "target": "es2016",
+    "lib": ["DOM", "ESNext"],
+    "strict": true,
+    "jsx": "preserve",
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "noUnusedLocals": true,
+    "strictNullChecks": true,
+    "forceConsistentCasingInFileNames": true,
+    "types": [
+      "vite/client",
+      "vite-plugin-pages/client"
+    ],
+    "paths": {
+      "~/*": ["src/*"]
+    }
+  },
+  "exclude": ["dist", "node_modules"]
+}

vite.config.ts

@@ -0,0 +1,52 @@
+import path from 'path'
+import { defineConfig } from 'vite'
+import Vue from '@vitejs/plugin-vue'
+import Pages from 'vite-plugin-pages'
+import Components from 'unplugin-vue-components/vite'
+import AutoImport from 'unplugin-auto-import/vite'
+import WindiCSS from 'vite-plugin-windicss'
+import VueI18n from '@intlify/vite-plugin-vue-i18n'
+
+export default defineConfig({
+  resolve: {
+    alias: {
+      '~/': `${path.resolve(__dirname, 'src')}/`,
+    },
+  },
+  plugins: [
+    Vue({
+      reactivityTransform: true,
+    }),
+
+    // https://github.com/hannoeru/vite-plugin-pages
+    Pages(),
+
+    // https://github.com/antfu/unplugin-auto-import
+    AutoImport({
+      imports: [
+        'vue',
+        'vue/macros',
+        'vue-router',
+        '@vueuse/core',
+      ],
+      dts: true,
+      dirs: [
+        './src/composables',
+      ],
+      vueTemplate: true,
+    }),
+
+    // https://github.com/antfu/vite-plugin-components
+    Components({
+      dts: true,
+    }),
+
+    WindiCSS(),
+
+    VueI18n({
+      runtimeOnly: true,
+      compositionOnly: true,
+      include: [path.resolve(__dirname, 'locales/**')],
+    }),
+  ],
+})

windicss.config.ts

@@ -0,0 +1,5 @@
+import { defineConfig } from 'windicss/helpers'
+
+export default defineConfig({
+  darkMode: 'class',
+})