import { fileURLToPath, URL } from 'node:url';
import { createRequire } from 'node:module';

import { defineConfig,loadEnv,splitVendorChunkPlugin } from 'vite';
import vue from '@vitejs/plugin-vue';
import { babel } from '@rollup/plugin-babel';
import svgLoader from 'vite-svg-loader';
import { visualizer } from 
 
'rollup-plugin-visualizer'; //打包大小分析（stats.html）
import viteCompression from 'vite-plugin-compression'; //打包壓縮

// https://vitejs.dev/config/
export default defineConfig(({command,mode})=>{
  const env = loadEnv(mode, process.cwd(), '');
  const isDev = env.NODE_ENV!=="production";
  return {
    plugins: [
      vue(),
      babel({
        babelrc: 
 
false,
        extensions: ['.ts', '.tsx'],
        plugins: [['@babel/plugin-transform-runtime', { useESModules: true }]],
        presets: [
          [
            '@babel/preset-env',
            {
              targets: ['chrome 87', 'safari 13', 'firefox 78', 'edge 88'],
              useBuiltIns: 
 
'usage',
              bugfixes: true,
              loose: false,
              modules: false,
              corejs: createRequire(import.meta.url)('core-js/package.json').version,
              shippedProposals: true,
              ignoreBrowserslistConfig: true,
            },
          ],
        ],
        exclude: 'node_modules/**',
        babelHelpers: 'runtime',
      }),
      splitVendorChunkPlugin(),
      // VueI18nPlugin({
      //   /* options */
      //   // locale messages resource pre-compile option
      //   include: ['./src/**/lang/**/*.json', './src/**/lang/*.json'],
      // }),
      // svgLoader({
      //   svgoConfig: {
      //     plugins: [
      //       {
      //         name: 'preset-default',
      //         params: {
      //           overrides: {
      //             removeViewBox: false, // 禁用外掛
      //           },
      //         },
      //       },
      //       {
      //         name: 'removeAttrs',
      //         params: {
      //           attrs: '(width|height|fill)', // 清除svg屬性
      //         },
      //       },
      //     ],
      //   },
      // }),
      visualizer(),
      viteCompression(),
    ],
    //全域性變數得這樣寫，否則會報not defined
    define: {
      __APP_ENV__: isDev?'"devlopment"':'"production"'
    },
    // 打包配置
    build: {
      outDir: 'dist', //指定輸出路徑
      assetsDir: 'assets', // 指定生成靜態資源的存放路徑
      //生產環境移除console
      minify: 'terser', // 混淆器，terser構建後文件體積更小
      terserOptions:{
        compress:{
          drop_console:!isDev,
          drop_debugger:!isDev
        }
      },
      rollupOptions: {
        output: {
          manualChunks: {
            // 打包優化
            core: ['vue', 'vue-router', 'vuex']
          },
        },
      },
    },
    server:{
      open:true, //vite專案啟動時自動開啟瀏覽器
      hmr:true, //開啟熱更新
      port:8090,
    },
    resolve: {
      alias: {
        '@': fileURLToPath(new URL('./src', import.meta.url)),
        //比如圖片資源都在src/assets/image目錄下，不想在專案中每次都通過require("../assets/image/1.jpg")這樣寫一長串去引用。
        "/images":"src/assets/images/",//這裡不能通過path模組解析路徑的寫法
      }
    }
  }
})