How to let vite project (react.js) support old IE and old broswer? (vue3 do not support IE11)

vite.config.ts 

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

import legacy from '@vitejs/plugin-legacy'

import { resolve } from 'path'
const pathResolve = (dir: string): any => resolve(__dirname, '.', dir)

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    legacy({
      targets: [
        "ie >= 0",
        '> 0%'
      ],
      additionalLegacyPolyfills: ["regenerator-runtime/runtime"],
      polyfills: true
      //polyfills: ['es.promise.finally', 'es/map', 'es/set'],
      //modernPolyfills: ['es.promise.finally'],
    }),
  ],
  css: {
    preprocessorOptions: {
      less: {
        javascriptEnabled: true,
        additionalData: `@import "${pathResolve('src')}/assets/less/variables.less";`
      }
    },
  },
})

package.json

Basically you need “@vitejs/plugin-legacy”, “es6-promise”, “isomorphic-fetch”.

{
  "name": "project_of_yingshaoxo",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vue-tsc && vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "es6-promise": "^4.2.8",
    "isomorphic-fetch": "^3.0.0",
    "less": "^4.1.3",
    "vue": "^3.2.47"
  },
  "devDependencies": {
    "@types/node": "^18.15.11",
    "@vitejs/plugin-legacy": "^4.1.1",
    "@vitejs/plugin-vue": "^4.1.0",
    "terser": "^5.19.2",
    "typescript": "^5.0.2",
    "vite": "^4.3.9",
    "vue-tsc": "^1.4.2"
  }
}

main.ts

import { createApp } from 'vue'

// old ie does not have fetch, that's why you use 'isomorphic-fetch' to let it support it
import * as e6p from "es6-promise";
(e6p as any).polyfill();
import 'isomorphic-fetch';

import App from './App.vue'

createApp(App)
.use(Antd)
.mount('#app')

​