美文网首页
vite开发vue3打包后,在浏览器正常使用,在其他嵌套打开是空

vite开发vue3打包后,在浏览器正常使用,在其他嵌套打开是空

作者: 焚心123 | 来源:发表于2023-10-12 10:16 被阅读0次
    原因:嵌套的浏览器版本过低进行兼容即可

    vite代码版本较高,导致低版本浏览器无法运行

    vite项目浏览器兼容性
    vue3打包后在低版本浏览器或webview中出现白屏,原因就是因为语法兼容问题。根据vite官方文档描述,build.target默认支持 Chrome >=87、Firefox >=78、Safari >=14、Edge >=88 传送,所以需要我们手动兼容低版本。

    解决办法
    1.首先安装插件:npm i @vitejs/plugin-legacy -D
    2.然后配置vite.config.js

    import legacyPlugin from '@vitejs/plugin-legacy';
    export default defineConfig({
    plugins: [
    legacyPlugin({
    targets: ['chrome 52'], // 需要兼容的目标列表,可以设置多个
    additionalLegacyPolyfills: ['regenerator-runtime/runtime'], // 面向IE11时需要此插件
    }),
    ]
    })
    

    重新打包、运行到浏览器,则低浏览器不会报错了

    相关文章

      网友评论

          本文标题:vite开发vue3打包后,在浏览器正常使用,在其他嵌套打开是空

          本文链接:https://www.haomeiwen.com/subject/ykanbdtx.html