一、场景复现

改动的是16年左右的React项目，各环境启动脚本如下：

当执行dev脚本将项目运行起来时，发现箭头函数和async同时使用会造成箭头函数内的无法访问并报错如下

二、事故分析思路

最初碰到这个问题很懵逼，因为无论在语法的角度还是在this指向角度，都是正常的，正无从下手的时候，想起福尔摩斯的一句名言：排除一切不可能，剩下的即便看上去再不可能，那也是真相

三、具体分析

首先列举可能的原因

语法问题
接口问题
本地环境
环境变量

接着挨个排除：

语法问题：这部分在语法上没有涉及到奇淫技巧，都是正规的语法，排除
接口问题：将当前使用到的接口数据和prod对比后，除了数值有差异，字段都一致，排除
本地环境：因为dev/pre/prod都是本地环境，pre/prod都正常，排除
环境变量：通过脚本发现，dev和prod相比，少了两个环境变量，通过挨个排查发现跟NODE_ENV变量有关

接着就去查跟NODE_ENV有关的webpack配置，由于对该项目打包脚本的不熟悉，迟迟没有找到原因，正打算再次将NODE_ENV的所有地方都给挨个排查的时候，发现dev环境下，浏览器里的代码如下：

prod环境下浏览器代码如下

对比后发现是react-hot-loader的问题，最初想解决一下，但因为项目太老，对底层改动担心带来太多副作用，就将箭头函数改成普通函数的方式去解决问题

记录一个问题的解决过程相关推荐

记录MEMORY_MANAGEMENT蓝屏解决过程
MEMORY_MANAGEMENT蓝屏解决过程问题描述 win10,1909版本,一个月内蓝屏两至三次,都是在空闲时蓝屏,提示MEMORY_MANAGEMENT 仅安装火绒,内存4+16(cruci ...
通过一个Kafka故障解决过程阐述架构师必须具备的架构思维
本文是Kafka系列第4篇,从问题出发,从而探讨集群分区迁移实战.底层原理以及运维时需要考虑的问题. 掌握一到两门java主流中间件,是敲开BAT等大厂必备的技能,送给大家一个Java中间件学习路线, ...
记录一个坑的解决历程
声明一个按钮属性: @property(nonatomic,strong)UIButton *valueBtn; 复制代码在页面初始化地方创建按钮: self.valueBtn = [[UIButt ...
记录一次bug解决过程：数据迁移
一总结不擅长语言表达,勤于沟通,多锻炼调试MyBatis中SQL语法:foreach 问题:缺少关键字VALUES.很遗憾:它的错误报的让人找不着北. 二 BUG描述:MyBatis中批量插入数 ...
源码必须会丨一个bug的解决过程，让你明白阅读源码的重要性！
一. 背景我们知道,有时候样本范围内的数据并不都是我们所需要的,某些情况下我们只需要其中的一部分.在这种情况下,我们在遍历样本时,就需要对取出的每一个样本数据进行判断,看看该样本是否满足我们的需要, ...
记录一次bug解决过程：eclipse Installed JREs 配置引出的问题
一总结 eclipse Installed JREs 配置引出的问题:编译以来JDK,不是JRE spring boot内嵌tomcat运行程序,tomcat:run 二 Bug描述:eclipse ...
记一次crontab 报“abrt: detected unhandled Python exception in ”错误的解决过程
题记上周把一个python服务迁移到新的机器上,顺带着需要把python写的一个后台任务也迁移到新的机器.但是在新的机器上python的定时任务就是不执行.下面记录一下自己的解决过程,以备以后查阅. ...
生产中NFS案例记录---写入权限解决过程
生产中NFS案例记录---写入权限解决过程 NFS配置要求: 1. 将oracle文件写入到NFS Server端,注意权限要与oracle端一致. 2. Oracle端目录文件所属用户为or ...
生产环境GC故障解决过程记录
2019独角兽企业重金招聘Python工程师标准>>> 排查了五六个小时,终于解决了GC的问题,记录一下希望可以帮到有需要的人,本文假定读者对GC知识有一定的了解如果不了解可以先参 ...

记录一个问题的解决过程

一、场景复现

二、事故分析思路

三、具体分析

记录一个问题的解决过程相关推荐

最新文章

热门文章