我 - 又被 npm 背刺了 🤦‍♂️

本文涉及的产品
日志服务 SLS,月写入数据量 50GB 1个月
简介: 事情是这样,中午一位同学在开发时突然给我发了一张截图,里面是一段报错信息,大致就是不能读取 undefined 的 node 属性。

事情是这样,中午一位同学在开发时突然给我发了一张截图,里面是一段报错信息,大致就是不能读取 undefinednode 属性。

网络异常,图片无法展示
|

由于内部 CLI 工具(内部多个项目的开发、构建都需使用 CLI)是我负责的,所以就来找我问问啥情况,因为目前就他一个人出现这个状况,我也没太在意,就问他怎么出现的,据他所说是他的某同事本地安装了两个包,然后他将其删除了,然后就出现这个状况了。

于是乎我就去看了他项目的代码,然后发现他项目里很多 import 了其中某个删除包的代码。虽然上面的报错信息看起来并不是包不存在的报错,但他这删了包不删引用的操作着实吓到我了。于是乎我吐槽一番让他把包或者引用修改完了再试试。然后隔了好久他也没再提过这个问题,我以为解决了也没放在心上。

下班倒计时

然而,下班前半小时,突然另一位同学找到我,说他在 CI/CD 发布时报错了(CI/CD 中使用 CLI 进行构建),我上去看了下日志,居然是一个报错 🤦‍♂️,这。。。不是想让我加班么。不可能,嘿嘿决不妥协。

于是乎我赶紧先尝试本地复现,报错信息虽然是我写的某个模版文件里的代码报错,但是我确信和该文件无关(就是这么自信 🐒),应该是依赖的问题。一番操作无果后又删除 lock 文件、node_modules 后,重新安装,终于使用 npm 安装后成功复现(yarn 安装无法复现,node_modules 不删直接用 npm 安装也无法复现,离谱,由于时间有限没有深究)。基本可以断定,肯定是某个依赖包升级又给我玩背刺了。🤦‍♂️ 此时距离下班只剩下 12 分钟时间紧急(npm install 实在太慢了,还经常报错,浪费了宝贵的几分钟)。

倒计时 12 分钟

然后我变就盯上了上面截图中的报错日志,想从日志中定位。

at plainFunction (.../node_modules/@babel/helper-wrap-function/lib/index.js:69:17)
at wrapFunction (.../node_modules/@babel/helper-wrap-function/lib/index.js:128:5)
at _default (.../node_modules/@babel/helper-remap-async-to-generator/lib/index.js:47:35)
复制代码

看到报错栈从 @babel/helper-wrap-function 中出现,于是我打开这个文件,定位到了这段代码:

function plainFunction(path, callId, noNewArrows, ignoreFunctionLength) {
    let functionId = null;
    let node;
    if (path.isArrowFunctionExpression()) {
        path = path.arrowFunctionToExpression({
            noNewArrows
        });
        node = path.node;
    } else {
        node = path.node;
    }
    // ...
}
复制代码

没毛病了,应该就是这里的 path 出问题了,于是我去看了看这个包的更新日志。

7.18.10 2 days ago
7.18.9 16 days ago
复制代码

好家伙,2 天前更新,应该没跑了,为了确信我又点进 GitHub,果然找到了一条相关的 issue。可以定案了,就是这货更新搞的鬼,不是我的锅(松口气)。

倒计时 8 分钟

问题确定了,解决方案就好说了,直接锁定该包的版本就是了(别问我为什么这个项目没有 lock 文件,我不知道,不是我干的,逃。。。)。

可是。。。 我 TM 忘了怎么锁定来着(用的太少早就忘了),好像是 resolution 来着?于是乎我又搜索一番,确定有个 resolutionsyarn 下可用,npm 不知道,不管了先试试。结果不出所料,无效。行吧只能去 package.json 描述找找了,终于找到了这个: [overrides](https://docs.npmjs.com/cli/v8/configuring-npm/package-json#overrides),就是他了。

于是我赶紧在 package.json 中添加了:

"overrides": {
    "@babel/helper-wrap-function": "7.18.9"
  }
复制代码

然后本地 npm i 确定版本锁定生效,美滋滋的提交了,此时距离下班还有 3 分钟,完美守卫住了我的下班时间。

相关实践学习
【涂鸦即艺术】基于云应用开发平台CAP部署AI实时生图绘板
【涂鸦即艺术】基于云应用开发平台CAP部署AI实时生图绘板
相关文章
|
资源调度 前端开发 算法
前端依赖版本重写指南
感谢神奇的 Semver 动态规则,npm 社区经常会发生依赖包更新后引入破坏变更的情况(应用没有使用依赖锁的话),而应用开发者就要在自己的依赖声明里先临时绕过,避免安装到有问题的版本,如果是一级依赖,只需要改 package.json 的声明就可以了,但如果是子依赖,就需要进行版本重写(overrides/resolution)了。本文是一篇针对版本重写功能的指南性文章,当你遇到如下的问题时,就可以按照对应的依赖重写语法,解决这些依赖问题了。
7220 1
前端依赖版本重写指南
|
Web App开发
在 HTML 中禁用 Chrome 浏览器的 Google 翻译功能
在 html 标签中添加 translate=“no” 属性,浏览器将不会翻译整个页面。
670 0
|
Java Apache
EasyPOI操作Excel从零入门
我们不造轮子,只是轮子的搬运工。(其实最好是造轮子,造比别人好的轮子)开发中经常会遇到excel的处理,导入导出解析等等,java中比较流行的用poi,但是每次都要写大段工具类来搞定这事儿,此处推荐一个别人造好的轮子,EasyPOI封装了Apache的POI技术,实现了基本的Excel导入、导出从此不再为Excel操作头疼~
503 2
EasyPOI操作Excel从零入门
element 下拉菜单el-dropdown如何更改样式?
element 下拉菜单el-dropdown如何更改样式?
1772 0
|
10月前
|
前端开发 JavaScript UED
处理 React 运行时中的错误和异常
【10月更文挑战第25天】在React运行时中,有效地处理错误和异常对于确保应用的稳定性和用户体验至关重要。
|
12月前
|
存储 Java
java的Excel导出,数组与业务字典匹配并去掉最后一个逗号
java的Excel导出,数组与业务字典匹配并去掉最后一个逗号
142 2
|
编解码 开发工具 git
解决Ubuntu16.04视频编码出现Unknown encoder 'libx264'问题
解决Ubuntu16.04视频编码出现Unknown encoder 'libx264'问题
666 0
|
移动开发 前端开发 JavaScript
游戏开发技术- 请谈谈WebGL与Canvas的区别,以及在什么情况下更适合使用WebGL。
WebGL和Canvas都是网页游戏开发的关键技术。Canvas是2D绘图API,适合初学者和简单的2D游戏,而WebGL是基于OpenGL的3D渲染标准,用于复杂3D图形和游戏,提供GPU硬件加速。当涉及3D渲染、高级视觉效果或高性能需求时,WebGL是更好的选择。对于轻量级2D应用,Canvas就足够了。某些游戏引擎支持两者自动切换,以实现最佳性能和兼容性。
1043 4
|
Web App开发 JavaScript 前端开发
nodejs入门,这一篇就够了
nodejs入门,这一篇就够了
1813 0
nodejs入门,这一篇就够了
|
Web App开发 缓存 JavaScript
Chrome浏览器清除页面js文件缓存的方法
Chrome浏览器清除页面js文件缓存 Chrome浏览器清除js缓存方法虽然简单,但有些人还是不太会,有些人会去设置里面清除有时候没有用,这里写一下简单步骤,使用一次以后就会了,而且...
5290 0

热门文章

最新文章