一个umi4的项目适配到FireFox60.7.1esr版本上的从头到尾

news2024/10/6 14:38:58

项目场景:

一个使用umi4创建的大屏项目,用户的浏览器使用的是火狐60.7.1的稳定版。然后就报错了!!!

为什么不让用户换谷歌嘞,咱也不知道。那咱就搞兼容吧~~

贴个浏览器的版本图片:


问题历程

先看出现的问题吧
ReferenceError: globalthis is not defined

ok,上百度。答案都是大同小异,需要自己去定义一下globalThis
但是,感觉不应该这么搞!!!
先查查globalThis是啥吧,这里这里MDN
OK,又get一个知识点~~~

感觉还是得去umi官方文档上去找,他们肯定会考虑到这种浏览器环境变量啥的问题吧。
这时leader发来一个链接,这不就是了吗。
在这里插入图片描述
好吧,我得先在我电脑上安个旧版本的火狐。
好家伙,幸好提前发现了这个,要不然又得浪费时间,拿出了尘封的windows10。
火狐各版本的下载地址


loading~~~
终于整好了,确实有错。不光build完有错,运行时也有错!!!
搞代码:

  1. 直接目标火狐60:
targets: {
    firefox: 60,
  },
  1. 以防万一,es5也给他整上(后期试过了,不加也可以)
jsMinifier: 'terser',
cssMinifier: 'cssnano',

run start ~~~~
天灵灵地灵灵 ~~~~


我就知道没这么简单,第二个问题出现了!!!

Table组件出现了问题,就是antd的那个table。
先看看是不是组件兼容性问题,直接在我还热乎的60的firefox上打开antd的官方。找到table组件的页面,报错了。哈哈,不是代码的问题~~~

上百度~~~~ ,找到了。
降版本 npm i antd@4.15.3 ~~~~
run start ~~~~
天灵灵,地灵灵 ~~~~


服了这个老六,升个版本能咋了。
新问题Bug

应该是antd版本低没有这个全局的样式变量了吧?

继续百度,这个这个
代码走起:

theme: {
  'primary-color-hover': '#1890FF7F',
  'primary-color': '#1890FF',
},

哇咔咔,终于好了~~
打包再看看。哇塞,也好着嘞。


感谢观看!!!

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

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

相关文章

【springboot】从解决@valid失效问题 到根据判断放行的更灵活替代方案 再到优雅的打日志

文章目录前言valid失效问题替代方案前言 valid 可以帮助我们节省很多代码 比较方便 但操作失误时 可能会失效 达不到我们预期效果; valid会有个问题 因为注解过于方便 反而会导致拦截后 错误日志的收集会比较麻烦 ,以及在面对有时需要拦截 有时不需要拦截…

机器学习中的模型选择和评估

机器学习中的模型选择和评估1. 介绍2. 模型拟合效果2.1欠拟合与过拟合表现方式2.2 避免欠拟合与过拟合的方法3.实例分析3.1鸢尾花数据集3.2 对鸢尾花数据进行聚类1. 介绍 在机器学习系统中,如何训练出更好的模型、如何判断模型的效果,以及模型是否过拟合…

【内存对齐】一篇文章带你看懂内存对齐(万字详细介绍+代码样例)

目录 为什么需要内存对齐 性能 范围 原子性 结论 数据模型 C 的内存对齐 具名要求 平凡类 标准布局类 平凡类与标准布局类总结 标准布局类的内存对齐 普通的标准布局类 带有位域的标准布局类 手动指定对齐大小的标准布局类 非标准布局类的内存对齐 GLSLang 的…

分布式事务(3):AT模式实战-Seata

1 介绍 Seata(Simple Extensible Autonomous Transaction Architecture,简单可扩展自治事务框架)是 2019 年 1 月份蚂蚁金服和阿里巴巴共同开源的分布式事务解决方案。Seata 开源半年左右,目前已经有接近一万 star,社…

信息系统项目管理师考试总结

1、结果展示 从结果上看,论文刚刚过,案例分析差两份,选择题差五分。 问题一:案例分析中,计算题可以拿到分,提高案例分析的通过率。计算题比较客观。可以在下一次考试中多准备准备。 问题二:客观…

QUIC的诞生

背景 自1999年HTTP/1.1被提出以来,它已经稳定地被使用超过了20个年头。不过经典并不意味着完美,HTTP/1.1中一个连接同一时刻只能处理一个HTTP请求,如果当前的请求没有结束之前,其他的请求只能处于阻塞状 态。这一“对头阻塞”问题…

权限管理的配置思路

1.在main.js中引入permission.js 2.permission.js中通过vuex中getters.access_token进行路由的重定向 直接import ‘.permission’

MSF基本使用和控制台命令

前言 ● Msfconsole使用接口 ○ 最流行的用户接口 ○ 几乎可以使用全部MSF功能 ○ 控制台命令支持TAB自动补全 ○ 支持外部命令的执行(系统命令等) ○ 点击鼠标启动 / msfconsole -h -q -r -v / exit ○ help / ? / help vulns 控制台命令 …

【Python】利用Python实现精准三点定位(经纬度坐标与平面坐标转换法求解)

【Python】利用Python实现精准三点定位(经纬度坐标与平面坐标转换法求解) 众所周知,如果已知三个点的坐标,到一个未知点的距离,则可以利用以距离为半径画圆的方式来求得未知点坐标。 如果只有两个已知点,则…

【Array数组】面试前基础知识点深度记忆总结

写本篇博客的原因是发现有人遇到了以下误区, 1、在我面试别人的过程中,我想让他说一下数组的一些内置方法和含义,然后他条例思路不太清晰,跳动着说,所以遗漏了很多,或许按照es5到es6是一个指导顺序&#xf…

51单片机——独立按键实验,小白讲解,相互学习

按键介绍: 按键是一种电子开关,使用时轻轻按开关按钮就可式开关接通,当松手时,开关断开。开发板上使用的按键及内部简易图如下图: 按键管脚两端距离长的表示默认是导通状态,距离短的默认是断开状态&#xf…

Pandas-根据数据表1中的字段a,筛选出数据表2中也包含字段a的数据

前言 本文是该专栏的第18篇,后面会持续分享python的数据分析知识,记得关注。 假设现在有个数据分析的需求,如下: 数据表1中有几十万条数据,数据表2中有几万条数据,两张数据表1和2有两个相同的字段phone,现在需要将数据表1和数据表2中,phone字段存在相同的行,保留下来…

redis集群操作

Redis集群1 集群2 集群架构图3 集群细节4 集群搭建4.1.创建集群4.2.查看集群状态4.3.添加主节点4.4.添加从节点4.5.删除副本节点4.6.集群在线分片1 集群 Redis在3.0后开始支持Cluster(模式)模式,目前redis的集群支持节点的自动发现,支持slave-master选举…

Nmap系统扫描实战

今天继续给大家介绍渗透测试相关知识,本文主要内容是Nmap系统扫描实战。 免责声明: 本文所介绍的内容仅做学习交流使用,严禁利用文中技术进行非法行为,否则造成一切严重后果自负! 再次强调:严禁对未授权设备…

解决Win系统cad激活安装失败问题,AutoCad 2022 中文/英文正式详细安装教程

Autodesk AutoCAD 2022简称“cad 2022”是一款功能强大的CAD三维绘图辅助设计软件。autocad 2022适用于二维绘图、详细绘制、设计文档和基本三维设计,广泛应用于机械设计、工业制图、工程制图、土木建筑、装饰装潢、服装加工等多个行业领域。CAD2022新特征&#xff…

线径看板帮助电线电缆厂提高生产效率的工作原理

当今,市场上出现了越来越多的电线电缆品牌,电线电缆市场的竞争越来越激烈,电线厂家稍有不慎,出现了产品不规范、不合格的异常情况,就很可能会被市场淘汰,被消费者所抛弃。那么,要怎样才能够保障…

MVC(Model,View,Controller)

MVC是指Model(模型层,数据),View(视图层),Controller(控制层) 核心是DispathcherServlet(一个Servlet) (1) 客户端的请求提交给DispathcherServlet (2)DispathcherServl…

【动态规划篇】斐波那契数列拆分词句三角矩阵

🌠作者:阿亮joy. 🎆专栏:《数据结构与算法要啸着学》 🎇座右铭:每个优秀的人都有一段沉默的时光,那段时光是付出了很多努力却得不到结果的日子,我们把它叫做扎根 目录👉…

基于Java(JSP+Servlet)+Mysql实现的(Web)简易的工资管理系统【100010062】

1.问题描述 一个公司下分为若干部门,每个部门有若干职员和经理,每个部门经销若干种商品。工资由基本工资、产品销售业绩奖、若干种保险的扣除等组成。其中的销售业绩奖按以下方式设计:职员按其完成额的 5% 提成,经理按其部门完成…

string.IsNullOrEmpty和string.IsNullOrWhiteSpace的区别

string.IsNullOrEmpty和string.IsNullOrWhiteSpace 本人一直使用的是string.IsNullOrEmpty方法来判断字符串是否为空. 在插件中发现另外一种写法: string s1 null; string s2 string.Empty; string s3 ""; strin…