vite5 打包项目兼容ie和低版本chrome

背景: vite打包后的项目 在低版本chrome无法使用

直接打包项目在69版本的chrome上无法加载  报错

解决方法:

使用vite官方推荐的插件 @vitejs/plugin-legacy
1、下载

npm i @vitejs/plugin-legacy -D

2、vite.config.js

import legacy from "@vitejs/plugin-legacy"
plugins: [legacy({targets: ["defaults", "ie >= 11", "chrome 69", "Chrome >= 49"], //需要兼容的目标列表,可以设置多个additionalLegacyPolyfills: ["regenerator-runtime/runtime"],renderLegacyChunks: true,polyfills: ["es.promise.all-settled","es.object.entries","es.symbol","es.array.filter","es.promise","es.promise.finally","es/map","es/set","es.array.for-each","es.object.define-properties","es.object.define-property","es.object.get-own-property-descriptor","es.object.get-own-property-descriptors","es.object.keys","es.object.to-string","web.dom-collections.for-each","esnext.global-this","esnext.string.match-all"],modernPolyfills: ["es.promise.all-settled", "es.object.entries"]})
]

配置好后npm run build:prod打包看下效果

报错如下

修改vite.config.js中 legacy配置项 

 polyfills: ["es.promise.all-settled","es.object.entries",]
modernPolyfills: ["es.promise.all-settled", "es.object.entries"]

重新打包 可以了

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/58785.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

最逼真的AI换脸软件,Pluse下载介绍(可直播)

Pluse是基于人工智能的实时AI换脸工具,可以在无需任何前期数据训练的情况下,通过一张照片快速替换视频中的人脸,它支持高分辨率细节重建、色彩矫正,并能实时替换多目标人脸,非常适合娱乐社交、影视制作和虚拟现实等多种…

在米尔电子MPSOC实现12G SDI视频采集H.265压缩SGMII万兆以太网推流

1. 引言 随着网络视频平台的发展,用户对于4K高清画质的需求日益增长。然而,许多用户发现,即使购买了视频平台的会员,观看4K内容时画质却不如预期,有时甚至还会出现模糊、卡顿的情况。这种现象背后涉及到视频编码、网络…

数据结构与算法实验练习(三)(排序及线性表的应用)

数据结构与算法分析课下实验练习,现记录一下解答过程,欢迎大家批评指正。 声明:本题目来源于西安交通大学电信学院原盛老师,任何单位或个人在使用、转载或引用本题目时,请务必标明出处为“西安交通大学电信学院原盛老…

日志代码编写

🌎日志代码编写 文章目录: 日志代码编写 了解日志 日志编写       日志等级       获取时间信息       获取文件名行号及处理可变参数列表       以宏的形式传参       日志加锁       日志消息输出方式 完整代码 …

HCIA笔记整合

第一部分: OSI七层模型 应用层:人机交互 抽象语言--------编码 表示层:编码------二进制 会话层:提供会话号 传输层:TCP/UDP 分段(收到MTU值的限制) MTU:最大传输单元&#xff…

Kafka集群数据迁移方案

概述 MirrorMaker2(后文简称 MM2)在 2019 年 12 月随 Kafka 2.4.0 一起推出。顾名思义,是为了解决 Kafka 集群之间数据复制和数据同步的问题而诞生的 Kafka 官方的数据复制工具。在实际生产中,经常被用来实现 Kafka 数据的备份&a…

Prometheus监控平台部署与应用

Prometheus特点 多维数据模型 PromSQL:一种灵活的查询语言,可以利用多维数据完成复杂的查询 不依赖分布式存储,单个服务器节点可直接工作 基于HTTP的pull方式采集时间序列数据 推送时间序列数据通过PushGateway组件支持 通过服务发现或静态配…

vue3 栅栏式拖拽布局组件

先看效果&#xff1a; 使用方法&#xff1a; 1、npm install fencelayout 2、引入使用 <template><Fencelayout><!-- 需要写的模块直接嵌套在这个下面就可以 --><div class"aaaa"><a-button>模块1</a-button></div><…

探索设计模式:命令模式

探索设计模式&#xff1a;命令模式 &#x1f9d0;1. 概念&#x1f3af;2. 作用&#x1f4e6;3. 实现3.1 定义命令接口3.2 实现具体命令3.3 实现接收者3.4 实现调用者3.5 使用 &#x1f4bb;4. 应用场景 命令模式&#xff08;Command Pattern&#xff09;就是一种行为型设计模式…

茅台最新任务脚本

茅台最新任务脚本 –小白教程— 这个脚本的作用是实现i茅台应用的自动预约功能&#xff0c;主要功能包括生成请求头、预约商品、计算距离和库存情况、发送微信推送消息等。 代码如下#!/usr/bin/python3cron: 0 0 9/21 * * * new Env(i茅台) import logging import sysimpor…

​CSS之三

CSS三大特性 CSS 有三个非常重要的三个特性:层圣性、继承性、优先级 层叠性 相同选择器给设置相同的样式&#xff0c;此时一个样式就会覆盖(层曼)另一个冲突的样式。层曼性主要解决样式冲突的问题 层叠性原则: - 样式冲突&#xff0c;遵循的原则是就近原则&#xff0c;哪个…

C++设计模式创建型模式———简单工厂模式、工厂方法模式、抽象工厂模式

文章目录 一、引言二、简单工厂模式三、工厂方法模式三、抽象工厂模式四、总结 一、引言 创建一个类对象的传统方式是使用关键字new &#xff0c; 因为用 new 创建的类对象是一个堆对象&#xff0c;可以实现多态。工厂模式通过把创建对象的代码包装起来&#xff0c;实现创建对…

python爬虫抓取豆瓣数据教程

环境准备 在开始之前&#xff0c;你需要确保你的Python环境已经安装了以下库&#xff1a; requests&#xff1a;用于发送HTTP请求。BeautifulSoup&#xff1a;用于解析HTML文档。 如果你还没有安装这些库&#xff0c;可以通过以下命令安装&#xff1a; pip install requests…

代码-画图函数示例

热力图 import matplotlib.pyplot as plt import seaborn as sns import numpy as npdef create_heatmap(people, categories, dataNone, title热力图, xlabel类别, ylabel人员,value_range(0.6, 0.95), figsize(10, 6),cmapYlOrRd, decimal_places3):"""创建热…

2024最新Twitter养号全面指南,品牌起号必看!

X (Twitter)作为活跃用户数以亿计的社交媒体平台&#xff0c;用户数依然在不断增长&#xff0c;其中巨大的流量吸引着个人用户与品牌和卖家。 Twitter养号是有必要的&#xff0c;有大量案例表明养好号&#xff0c;可以大幅度降低账号被冻结的几率&#xff0c;并提升账号的稳定…

百度如何打造AI原生研发新范式?

&#x1f449;点击即可下载《百度AI原生研发新范式实践》资料 2024年10月23-25日&#xff0c;2024 NJSD技术盛典暨第十届NJSD软件开发者大会、第八届IAS互联网架构大会在南京召开。本届大会邀请了工业界和学术界的专家&#xff0c;优秀的工程师和产品经理&#xff0c;以及其它行…

基于大语言模型(LLM)自主Agent 智能体综述

近年来,LLM(Large Language Model)取得了显著成功,并显示出了达到人类智能的巨大潜力。基于这种能力,使用LLM作为中央控制器来构建自助Agent,以获得类人决策能力。 Autonomous agents 又被称为智能体、Agent。指能够通过感知周围环境、进行规划以及执行动作来完成既定任务。…

电脑怎么设置开机密码:保障个人信息安全的第一步

在数字化时代&#xff0c;个人信息的安全至关重要。电脑作为我们日常工作和生活中不可或缺的设备&#xff0c;存储了大量的私人数据和敏感信息。为了防止未经授权的访问&#xff0c;设置开机密码是保护个人隐私和信息安全的基本措施之一。本文将详细介绍如何在不同操作系统下为…

分析 std::optional 的使用与常见错误

文章目录 引言常见错误及解决方案1. 错误使用 std::optional 变量进行算术运算2. 错误检查 std::optional 是否有值3. 忽视 std::optional 的默认值 结论 引言 std::optional 是 C17 引入的一个模板类&#xff0c;用于表示可能有也可能没有值的情况。它特别适用于函数返回值&a…

DB-GPT系列(二):DB-GPT部署(镜像一键部署、源码部署)

一、简介 DB-GPT 是一个开源项目&#xff0c;其将大语言模型 LLM 与数据库紧密结合。该项目主要致力于探索如何让预训练的大规模语言模型&#xff08;例如 GPT&#xff09;能够直接与数据库进行交互&#xff0c;从而生成更为准确且信息丰富的回答。 DB-GPT部署后能否直接使用…