import * as path from 'path'
import { defineConfig, loadEnv } from 'vite'

import vue from '@vitejs/plugin-vue'
import viteImagemin from 'vite-plugin-imagemin'
// import analyze from 'rollup-plugin-analyzer'

import entrypoints from './entrypoints.json'

process.env = { ...process.env, ...loadEnv('', '../..') }

const VITE_DEV_SERVER_ADDRESS = `${process.env.VITE_DEV_SERVER_PROTOCOL}://${process.env.VITE_DEV_SERVER_HOST}:${process.env.VITE_DEV_SERVER_PORT}`

export default defineConfig({
    server: {
        host: process.env.VITE_DEV_SERVER_HOST,
        port: process.env.VITE_DEV_SERVER_PORT ? +process.env.VITE_DEV_SERVER_PORT : 3000,
        strictPort: true
    },
    build: {
        manifest: true,
        outDir: 'assets/tmp-build',
        rollupOptions: {
            input: entrypoints,
            output: {
                manualChunks: {
                    jquery: ['jquery']
                }
            }
            // plugins: [analyze({ limit: 20 })]
        }
    },
    resolve: {
        alias: [
            { find: '@', replacement: path.resolve(__dirname, './assets/') },
            { find: 'vue', replacement: 'vue/dist/vue.esm-bundler.js' },
            { find: 'vue-i18n', replacement: 'vue-i18n/dist/vue-i18n.cjs.js' }
        ]
    },
    plugins: [
        vue({
            template: {
                compilerOptions: {
                    whitespace: 'condense'
                }
            }
        }),
        {
            name: 'static-asset-fixer',
            enforce: 'post',
            apply: 'serve',
            transform: (code) => {
                return {
                    code: code
                        .replace(/\/assets\/fonts\/([a-zA-Z0-9-]+).(eot|ttf|woff|woff2)/g, `${VITE_DEV_SERVER_ADDRESS}/assets/fonts/$1.$2`)
                        .replace(/\/assets\/images\/([a-zA-Z0-9-_/]+).(jpg|jpeg|png|svg)/g, `${VITE_DEV_SERVER_ADDRESS}/assets/images/$1.$2`),
                    map: null
                }
            }
        },
        viteImagemin({
            gifsicle: {
                optimizationLevel: 7,
                interlaced: false
            },
            svgo: {
                plugins: [
                    {
                        name: 'removeViewBox'
                    },
                    {
                        name: 'removeEmptyAttrs',
                        active: false
                    }
                ]
            }
        })
    ]
})