vite.config.ts

import { fileURLToPath, URL } from 'node:url'
import VueRouter from 'unplugin-vue-router/vite'
import autoprefixer from 'autoprefixer'
import tailwind from 'tailwindcss'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import dotenv from 'dotenv'
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import { VueRouterAutoImports } from 'unplugin-vue-router'

dotenv.config()

// https://vitejs.dev/config/
export default defineConfig({
    define: {
        'process.env': process.env
    },
    css: {
        postcss: {
            plugins: [tailwind(), autoprefixer()]
        }
    },
    plugins: [
        VueRouter(),
        AutoImport({
            include: [
                /\.[tj]sx?$/, // .ts, .tsx, .js, .jsx
                /\.vue$/,
                /\.vue\?vue/, // .vue
                /\.md$/, // .md
            ],
            imports: [
                'vue',
                VueRouterAutoImports,
                {'pinia': ['defineStore', 'storeToRefs', 'createPinia', 'acceptHMRUpdate']},
            ],
            dts: './auto-imports.d.ts',
            viteOptimizeDeps: true,
            dirs: ['src/stores']
        }),
        Components({
            dts: './components.d.ts'
        }),
        vue({
            template: {
                compilerOptions: {
                    isCustomElement: element => element.startsWith('iconify-icon')
                }
            }
        })
    ],
    resolve: {
        alias: {
            '@': fileURLToPath(new URL('./src', import.meta.url))
        }
    }
})