import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import viteCompression from 'vite-plugin-compression'
// 如果编辑器提示 path 模块找不到，则可以安装一下 @types/node -> npm i @types/node -D
import { resolve } from 'path'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    viteCompression({
      verbose: true,
      disable: false,
      threshold: 10240,
      algorithm: `gzip`,
      ext: `.gz`,
    }),
  ],
  // 配置别名
  resolve: {
    alias: {
      '@': resolve(__dirname, `src`),
      '@assets': resolve(__dirname, `src/assets`),
      '@router': resolve(__dirname, `src/router`),
      '@store': resolve(__dirname, `src/store`),
      '@components': resolve(__dirname, `src/components`),
      '@views': resolve(__dirname, `src/views`),
    },
  },
  // CSS 预处理器
  css: {
    preprocessorOptions: {
      less: {
        //https://github.com/vueComponent/ant-design-vue/blob/main/components/style/themes/default.less
        //下面列几个常用的  用于复制  用到其他的自己去上面网址找吧
        //@error-color  @red-5  这俩颜色一样  根据使用场景自行使用
        //@warning-color @gold-6 这俩颜色一样  根据使用场景自行使用
        //@success-color  @green-6 这俩颜色一样  根据使用场景自行使用
        //@disabled-color
        //@text-color
        //@text-color-secondary
        //@border-color-base
        //@border-color-split
        //@font-size-base  14px
        //@margin-lg: 24px; // containers
        //@margin-md: 16px; // small containers and buttons
        //@margin-sm: 12px; // Form controls and items
        //@margin-xs: 8px; // small items
        //@margin-xss: 4px; // more small
        //@padding-lg: 24px; // containers
        //@padding-md: 16px; // small containers and buttons
        //@padding-sm: 12px; // Form controls and items
        //@padding-xs: 8px; // small items
        //@padding-xss: 4px; // more small
        modifyVars: {
          hack: `true; @import (reference) "${resolve(`src/assets/less/index.less`)}";`, //将ant里面所有的变量引进来
          // 'primary-color': `#0f608a`,
          // 'border-radius-base': `4px`,
          // 'modal-header-padding': `@padding-sm`,
          // 'modal-body-padding': `@padding-sm`,
          // 'modal-header-close-size': `48px`,
          // 'modal-footer-padding-horizontal': `@padding-sm`,
          //非ant样式变量
          'scrollbar-size': `8px`,
          'scrollbar-background': `#00000080`,
          'scrollbar-track-background': `transparent`,
        },
        javascriptEnabled: true,
      },
    },
  },
  base: `./`, // 设置打包路径
  //启动服务配置
  server: {
    host: `0.0.0.0`,
    port: 8000,
    open: true, // 设置服务启动时是否自动打开浏览器
    cors: true, // 允许跨域
    https: false,
    // 设置代理，根据我们项目实际情况配置
    // proxy: {
    //   '/api': {
    //     target: 'http://xxx.xxx.xxx.xxx:8000',
    //     changeOrigin: true,
    //     secure: false,
    //     rewrite: (path) => path.replace('/api/', '/')
    //   }
    // }
  },
  //去除 console debugger
  build: {
    terserOptions: {
      compress: {
        drop_console: true,
        drop_debugger: true,
      },
    },
  },
})