I am trying to configure my vitejs React app to run in IE11 and above. I have the following error viewing in MicroSoft Edge, in Internet Explorer Mode (IEChooser Dev Tools):
{
[functions]: ,
__proto__: { },
description: "'Symbol' is undefined",
message: "'Symbol' is undefined",
name: "ReferenceError",
number: -2146823279,
stack: "ReferenceError: 'Symbol' is undefined
at execute (http://localhost:4173/assets/index-legacy-e7ad95b1.js:1:3100)
at n (http://localhost:4173/assets/polyfills-legacy-c1ceefe8.js:1:36689)
at v (http://localhost:4173/assets/polyfills-legacy-c1ceefe8.js:1:36937)
at Anonymous function (http://localhost:4173/assets/polyfills-legacy-c1ceefe8.js:1:36603)
at ff (http://localhost:4173/assets/polyfills-legacy-c1ceefe8.js:1:26521)
at Anonymous function (http://localhost:4173/assets/polyfills-legacy-c1ceefe8.js:1:26752)
at $u (http://localhost:4173/assets/polyfills-legacy-c1ceefe8.js:1:24220)"
}
I created a fresh bare-bones app and still get the error:
npm create vite@latest
-- inputs: test-app, React, JavaScript
cd test-app
npm install
npm install --save-dev --save-exact @vitejs/plugin-legacy
vite.config.js:
import { defineConfig } from 'vite'
import legacy from '@vitejs/plugin-legacy';
import react from '@vitejs/plugin-react'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [react(),
legacy({
targets: ['ie >= 11'],
additionalLegacyPolyfills: ['regenerator-runtime/runtime'],
polyfills: ['es.array.iterator']
})]
})
npm run build && npm run preview
Open site in edge, turn on IE Mode. Blank screen.
Open “IEChooser” for dev tools by running command %systemroot%system32f12IEChooser.exe
, and am given the error above in the console.
How do I fix this error?