import { resolve } from 'path';
import vue from '@vitejs/plugin-vue';
import vueJsx from '@vitejs/plugin-vue-jsx';
import svgLoader from 'vite-svg-loader';
import configArcoStyleImportPlugin from './plugin/arcoStyleImport';
import type { UserConfigExport, ConfigEnv } from 'vite';

export default ({}: ConfigEnv): UserConfigExport => {
  return {
    base: '/',
    plugins: [
      vue(),
      vueJsx(),
      svgLoader({ svgoConfig: {} }),
      configArcoStyleImportPlugin()
    ],
    resolve: {
      alias: [
        {
          find: '@',
          replacement: resolve(__dirname, '../src')
        },
        {
          find: 'assets',
          replacement: resolve(__dirname, '../src/assets')
        },
        {
          find: 'vue',
          replacement: 'vue/dist/vue.esm-bundler.js' // compile template
        }
      ],
      extensions: ['.ts', '.js']
    },
    define: {
      'process.env': {}
    },
    publicDir: 'public',
    optimizeDeps: {
      include: ['mitt', 'dayjs', 'axios', 'pinia', '@vueuse/core'],
      exclude: ['@iconify-icons/lets-icons']
    },
    css: {
      preprocessorOptions: {
        less: {
          modifyVars: {
            hack: `true; @import (reference) "${resolve(
              'src/assets/style/variables.less'
            )}";`
          },
          math: 'parens-division',
          javascriptEnabled: true
        }
      }
    }
  };
};
