import {defineConfig} from 'vite'
import vue from '@vitejs/plugin-vue'
// vite.config.ts
import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'
import {ElementPlusResolver} from "unplugin-vue-components/resolvers";
import {resolve} from "path";
import {createSvgIconsPlugin} from 'vite-plugin-svg-icons'

// https://vitejs.dev/config/
export default defineConfig({
    plugins: [
        vue(),
        // Element-plus 按需导入，您需要使用额外的插件来导入要使用的组件
        AutoImport({
            resolvers: [ElementPlusResolver()],
        }),
        Components({
            resolvers: [ElementPlusResolver()],
        }),
        createSvgIconsPlugin({
            // Specify the icon folder to be cached
            iconDirs: [resolve(process.cwd(), 'src/assets/icons')],
            // Specify symbolId format
            symbolId: 'icon-[dir]-[name]',
        }),
    ],
    server: {
        // 自定义主机 IP
        host: 'localhost',
        // 自定义端口
        port: 8082,
        // 是否开启 https
        https: false,
        proxy: {
            // 配置需要代理的路径 --> 这里的意思是代理http://localhost:8081后的所有路由
            '/api': {
                // 目标地址 --> 服务器地址
                target: 'http://localhost:8081/',
                // 允许跨域
                changeOrigin: true,
                // 替换 API
                rewrite: (path: string) => path.replace(/^\/api/, '')
            },
        }
    },
    // 设置@为src目录
    resolve: {
        alias: {
            '@': resolve(__dirname, './src')
        }
    },
    css: {
        preprocessorOptions: {
            // scss 全局变量
            scss: {
                javascriptEnabled: true,
                additionalData: '@import "./src/styles/variables.scss";',
            },
        },
    }
})