import { defineConfig } from 'vite'
import reactRefresh from '@vitejs/plugin-react-refresh'
import dynamicImportVars from '@rollup/plugin-dynamic-import-vars'
import legacyPlugin from '@vitejs/plugin-legacy'
import visualizer from 'rollup-plugin-visualizer'
import path from 'path'

// 区分环境设置。用来打包和测试环境发布的相关
// const env = process.argv[process.argv.length - 1]
// const base = config[env]
// 关联cdn相关配置

// 官方提供的打包按需
import vitePluginImp from 'vite-plugin-imp'
// import _ from 'lodash-es'
// import $ from 'jquery'

// https://vitejs.dev/config/
export default defineConfig({
  // base: base.cdn
  base: './', // index.html文件所在位置
  root: './', // js导入的资源路径，src
  define: {
    'process.env.REACT_APP_IS_LOCAL': "'true'",
    // 'globalThis': {
    //   // _: _,
    //   jquery: $,
    //   $: $
    // },
    'global': 'globalThis'
  },
  build: {
    minify: 'terser', // 是否进行压缩,boolean | 'terser' | 'esbuild',默认使用terser
    manifest: false, // 是否产出maifest.json
    sourcemap: false, // 是否产出soucemap.json
    outDir: 'dist', // 产出目录
    assetsInlineLimit: 1024,
    cssCodeSplit: true,
    rollupOptions: {
      //按需加载
      plugins: [visualizer()],
      output: {
        manualChunks(id) {
          if (id.includes('node_modules')) {
            return id.toString().split('node_modules/')[1].split('/')[0].toString()
          }
        }
      }
    }
  },
  plugins: [
    reactRefresh(),
    legacyPlugin({
      targets: [
        'Android > 39',
        'Chrome >= 60',
        'Safari >= 10.1',
        'iOS >= 10.3',
        'Firefox >= 54',
        'Edge >= 15'
      ]
    }),
    dynamicImportVars({
      include: ['tsx'],
      warnOnError: true
    }),
    vitePluginImp({
      libList: [
        // 暂时还没有
        {
          libName: 'antd',
          style: (name) => `antd/lib/${name}/style/index.less`
        }
      ]
    })
  ],
  css: {
    preprocessorOptions: {
      scss: {
        additionalData: `$injectedColor: orange;`
      },
      less: {
        javascriptEnabled: true
      }
    },
    modules: {
      // 样式小驼峰转化,
      //css: goods-list => tsx: goodsList
      localsConvention: 'camelCase'
    }
  },
  esbuild: {
    // jsxFactory: 'h',
    // jsxFragment: 'Fragment'
  },
  resolve: {
    alias: {
      '~': path.resolve(__dirname, './ '), // 根路径
      '@': path.resolve(__dirname, 'src'),
      'components': path.resolve(__dirname, 'src/components')
    },
    extensions: ['.js', '.ts', '.tsx', '.jsx', '.mjs']
  },
  server: {
    proxy: {
      // 字符串简写方式
      //'/apit': 'http://localhost:9000',
      // 选项写法
      '/api': {
        target: 'http://127.0.0.1:8075', // 所要代理的目标地址
        // target: 'http://192.168.31.7:8075', // 所要代理的目标地址
        rewrite: (path) => path.replace(/^\/api/, ''), // 重写传过来的path路径，比如 `/api/index/1?id=10&name=zs`（注意:path路径最前面有斜杠（/），因此，正则匹配的时候不要忘了是斜杠（/）开头的；选项的 key 也是斜杠（/）开头的）
        changeOrigin: true // true/false, Default: false - changes the origin of the host header to the target URL
      }
    },
    hmr: { overlay: false }
  }
})

// export default defineConfig(({ command, mode }) => {
//   if (command === 'serve') {
//     return {
//       // serve 独有配置
//     }
//   } else {
//     return {
//       // build 独有配置
//     }
//   }
// })