uni-app: vue3 + vite + ts构建的H5 在iOS13上无法运行

都2023了,该用vue3了,这是我的第一个vue3项目,打出的H5包无法运行在iOS13的手机上(出现了白屏)
通过排查,最后发现构建工具vite默认支持浏览器版本如下:

vite默认支持浏览器版本

vite 官方文档:https://cn.vitejs.dev/guide/build.html

通过safari版本反推出iOS版本号:safari>=14, 对应的iOS>=14,所以无法运行在iOS13的safari浏览器上

image.png

解决办法:
vite.config.ts文件中修改默认构建配置,修改为build: {target: 'es2015'}

export default defineConfig({
    plugins: [uni(), commonjs()],
    build: {
        target: 'es2015'
    }
});

再重新打包,这样就可以运行在支持es2015的浏览器上了

es2015支持的浏览器版本:
桌面端浏览器对ES2015的支持情况
Chrome:51 版起便可以支持 97% 的 ES6 新特性。
Firefox:53 版起便可以支持 97% 的 ES6 新特性。
Safari:10 版起便可以支持 99% 的 ES6 新特性。
IE:Edge 15可以支持 96% 的 ES6 新特性。Edge 14 可以支持 93% 的 ES6 新特性。(IE7~11 基本不支持 ES6)

二、移动端浏览器对ES2015的支持情况
iOS:10.0 版起便可以支持 99% 的 ES6 新特性。
Android:基本不支持 ES6 新特性(5.1 仅支持 25%)

三、服务器对ES2015的支持情况
Node.js:6.5 版起便可以支持 97% 的 ES6 新特性。(6.0 支持 92%)
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。