import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import * as path from 'path'
import legacyPlugin from '@vitejs/plugin-legacy'

// 自动导入vue中hook reactive ref等
import AutoImport from 'unplugin-auto-import/vite'
//自动导入ui-组件 比如说ant-design-vue  element-plus等
import Components from 'unplugin-vue-components/vite'
//ant-design-vue
import { AntDesignVueResolver } from 'unplugin-vue-components/resolvers'

// svg plugin
import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'

import autoprefixer from 'autoprefixer'

import legacy from '@vitejs/plugin-legacy'

export default defineConfig({
	resolve: {
		//设置别名
		alias: {
			'@': path.resolve(__dirname, 'src')
		}
	},
	css: {
		postcss: {
			plugins: [
				autoprefixer({
					overrideBrowserslist: ['Chrome > 40', 'ff > 31', 'ie 11']
				})
			]
		}
	},
	plugins: [
		vue(),
		// 修改 svg 相关配置
		createSvgIconsPlugin({
			// 指定需要缓存的图标文件夹
			iconDirs: [path.resolve(__dirname, './src/assets/svg')]
		}),
		legacy({
			targets: ['cover 99.5%']
		}),
		legacyPlugin({
			targets: ['chrome 52'], // 需要兼容的目标列表
			additionalLegacyPolyfills: ['regenerator-runtime/runtime'] // 面向IE11时需要此插件
		}),
		AutoImport({
			//安装两行后你会发现在组件中不用再导入ref，reactive等
			imports: ['vue', 'vue-router'],
			dts: 'auto-import.d.ts',
			//ant-design-vue
			resolvers: [AntDesignVueResolver()]
		}),
		Components({
			//ant-design-vue
			resolvers: [AntDesignVueResolver({ importStyle: true, resolveIcons: true })]
		})
	],
	optimizeDeps: {
		include: ['core-js']
	},
	server: {
		proxy: {
			'/dev-api': {
				//target是代理的目标路径
				target: '',
				changeOrigin: true, //必须要开启跨域
				rewrite: (path) => path.replace(/\/dev-api/, '') // 路径重写
			}
		}
	}
})