vue3+vite适配低版本浏览器(只在谷歌65版本测试了)

项目框架采用的若依的vue3+vite4,打包发布后发现在低版本谷歌浏览器中报错页面进不去

解决方法

1.npm安装插件

npm install @vitejs/plugin-legacy -D

npm add -D terser //这个要安装，不然打包会报错`

2.vite.config.ts中修改

import legacy from '@vitejs/plugin-legacy'; 

plugins: [
      legacy({
        targets: ['defaults', 'not IE 11'],
        additionalLegacyPolyfills: ['regenerator-runtime/runtime'], // 面向IE11时需要此插件
        modernPolyfills: true
        // polyfills: ['es.object.values', 'es.array.flat-map']
      })
    ],

引入下载的插件,plugins中添加适配

原来页面中plugins代码

我安装完legacy修改完最后的页面代码,添加了两个地方

添加完成后运行,在65版本谷歌打开发现还是报错

但是打包发布后在65版本谷歌浏览器能正常访问页面

(作者只用了65版本谷歌做了尝试,本地运行不行,打包后发布可以访问页面,但是控制台有一些报错应该是不影响的)