import path from 'path'
import { loadEnv } from 'vite'
import type { ConfigEnv, UserConfig } from 'vite'

import { visualizer } from 'rollup-plugin-visualizer'
import Components from 'unplugin-vue-components/vite'
import AutoImport from 'unplugin-auto-import/vite'

import basicSsl from '@vitejs/plugin-basic-ssl'
import mkcert from "vite-plugin-mkcert";
import { VantResolver } from 'unplugin-vue-components/resolvers'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import vue from '@vitejs/plugin-vue'
import legacy from '@vitejs/plugin-legacy'
import vueJsx from '@vitejs/plugin-vue-jsx'

import viewport from 'postcss-mobile-forever'
import autoprefixer from 'autoprefixer'

import { viteVConsole } from 'vite-plugin-vconsole'
import { templateCompilerOptions } from '@tresjs/core'
import mock from './build/mock/createMockServer'

import { proxy } from './src/config/proxy'

export default ({ command, mode }: ConfigEnv): UserConfig => {
  const root = process.cwd()
  const env = loadEnv(mode, root)

  return {
    base: env.VITE_APP_PUBLIC_PATH,

    define: {
      'process.env.VUE_APP_API_BASE_URL': JSON.stringify(env.VITE_APP_API_BASE_URL),
      'process.env.VUE_APP_API_WX_URL': JSON.stringify(env.VITE_APP_API_WX_URL),
      'process.env.VUE_APP_PUBLIC_PATH': JSON.stringify(env.VITE_APP_PUBLIC_PATH),
      'process.env.mode': JSON.stringify(mode),
    },

    plugins: [
      vue({
        ...templateCompilerOptions,
      }),
      vueJsx(),
      visualizer(),

      legacy({
        targets: ['defaults', 'not IE 11'],
      }),
      
      Components({
        dts: true,
        include: [
          /\.[tj]sx?$/,
          /\.vue$/,
          /\.vue\?vue/,
        ],
        resolvers: [VantResolver(), ElementPlusResolver()],
        dirs: ['src/components', 'src/**/components',],
        extensions: ['vue', 'jsx', 'tsx', 'ts', 'js'],
        types: [],
      }),

      AutoImport({
        include: [
          /\.[tj]sx?$/,
          /\.vue$/,
          /\.vue\?vue/,
        ],
        imports: [
          'vue',
          'vue-router',
          'vitest',
        ],
        resolvers: [ElementPlusResolver()],
        vueTemplate: true,
        dts: true,
      }),

      // viteVConsole({
      //   entry: [path.resolve('src/main.ts')],
      //   localEnabled: command === 'serve' ,
      //   enabled: false,
      //   config: {
      //     maxLogNumber: 1000,
      //     theme: 'light',
      //   },
      // }),

      mock({
        watch: true,
        mockUrlList: [/api/],
        cwd: process.cwd(),
        enable: env.VITE_HTTP_MOCK === 'true' && process.env.NODE_ENV !== 'production',
      }),

      // mkcert(), // 支持https
      
      basicSsl()
    ],

    css: {
      postcss: {
        plugins: [
          autoprefixer(),
          viewport({
            rootSelector: '#app',
            viewportWidth: 375,
            maxDisplayWidth: undefined,
            border: false,
            disableMobile: false,
            disableDesktop: false,
            disableLandscape: false,
          }),
        ],
      },
    },

    build: {
      cssCodeSplit: false,
      chunkSizeWarningLimit: 2048,
      sourcemap: true,
      rollupOptions: {
        input: {
          index: path.resolve(__dirname, 'index.html'),
          oauth: path.resolve(__dirname, 'oauth.html'),
        },
        output: {
          chunkFileNames: 'static/js/[name]-[hash].js',
          entryFileNames: 'static/js/[name]-[hash].js',
          assetFileNames: 'static/[ext]/[name]-[hash].[ext]',
        },
      },
    },

    resolve: {
      alias: {
        '~@': path.join(__dirname, './src'),
        '@': path.join(__dirname, './src'),
        '~': path.join(__dirname, './src/assets'),
      },
    },

    server: {
      host: true,
      port: 80,
      https: true,
      proxy,
      // proxy: env.VITE_HTTP_MOCK === 'true'
      //   ? undefined
      //   : {
      //       '/api': {
      //         target: 'http://localhost',
      //         ws: false,
      //         changeOrigin: true,
      //       },
      //     },
    },
  }
}