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

news/2024/12/28 15:29:25/

项目场景:

一个使用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.ppmy.cn/news/416554.html

相关文章

【问题解决】BootStrap.css与layDate日期选择样式起冲突的解决办法

转载请注明出处:http://blog.csdn.net/qq_26525215 本文源自【大学之旅_谙忆的博客】  问题如图: 给大家看下正常的layDate年份选择图片: 一开始想到的,以为是自己没有将layer.css导入,或者layDate.css没有导入,出现的这个问题,结果发现只要导入layer.css,会自动…

threejs fire 火焰与烟雾效果

在threejs中有一个为我们提供了可以实现火焰和烟雾效果的包&#xff0c;我们可以直接引用这个包&#xff0c;通过设置某些参数实现需要的效果。 第一步引入fire包&#xff0c;可在工程文件夹下的example文件夹中找到 <script type"text/javascript" src"js…

firefox中focus问题解决

document.getElementById("username").focus(); 此js在IE中可用&#xff0c;但在firefox中失效&#xff1b; [colorred]解决方法&#xff1a;[/color] 加定时器 [sizemedium]window.setTimeout(function(){document.getElementById("username").focus(…

border html5样式,CSS属性参考 | border-color

border-color属性是用于设置一个元素的上右下左4个边框颜色的简写属性。border-color属性可以同时设置一个元素的border-left-color、border-right-color、border-top-color和border-bottom-color属性。 border-color属性的值可以是1个、2个、3个或4个。 如果为border-color属性…

为什么在Firefox里placeholder的颜色比设置的代码浅, 比其他浏览器浅

今天在开发的时候突然发现在Firefox下设置的placeholder颜色不是代码设置的颜色。本着码农朴实的精神&#xff0c;我先检查下是不是写错了。 毕竟各大浏览器都坚持以自我为中心&#xff0c;其他为goushi的精神。 坚持要苦逼的前端写不同兼容的代码。 但是不管姑奶奶我怎么改&am…

Firefox,火狐about:config设置详解

1、accessibility.accesskeycausesactivation accesskey 允许用户通过Alt accesskey的方法来打开页面中的超链接。其中的accesskey需要网页编写者预先定义好&#xff0c;并且不能与浏览器的快捷键相冲突。比如&#xff0c;常见的 Altq.当该值设置为true时&#xff0c;浏览支持…

轻松在Firefox中禁用JavaScript

Want a quick and easy way to toggle JavaScript on and off in Firefox? Then you will definitely want to take a good look at the JS Switch extension. 是否需要一种快速简便的方法来在Firefox中打开和关闭JavaScript? 然后,您一定会想看看JS Switch扩展。 Setup 建…

Video fire detection based on Gaussian Mixture Model and multi-color 基于高斯混合模型和多色特征的视频火灾检测 (英文论文翻译)

英文版论文原文&#xff1a;https://link.springer.com/content/pdf/10.1007%2Fs11760-017-1102-y.pdf 基于高斯混合模型和多色特征的视频火灾检测 Video fire detection based on Gaussian Mixture Model and multi-color features Xian-Feng Han, Jesse S. Jin& Ming-Jie…