vue3.0 + vite2.0+如何兼容低版本浏览器

一、问题

在使用vue3.2和vite2 开发一个移动端或者钉钉端 H5 微服务
ios app内置浏览器打开没问题
安卓 app 内置浏览器打开空白页面 vconsole 打印出现报错global this undefind

二、解决

内置浏览器 版本比较低 打印出来是 63
vue3 代码不兼容低版本浏览器

三、解决方案

步骤一： vite.config.ts里 build.target 配置项 指定构建目标为 es2015或者
步骤二：安装@vitejs/plugin-legacy 安装完 报错也还在 指定版本可以解决
“@vitejs/plugin-legacy”: “1.8.0”,
步骤三：配置 vite.config.ts

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

  legacy({
        targets: ['Chrome 63'],
        additionalLegacyPolyfills: ['regenerator-runtime/runtime'],
        modernPolyfills: true,
      }),

四、打包预览

完成以上操作 打包 安装本地服务器
npm install -g express-generator
初始化文件夹
express -e server
文件夹中运行
npm i 安装依赖
打包后的 dist 文件下所有文件
复制到 新建文件夹下 public下
并运行 npm start
运行后 location: 3000 进行访问