前端yarn工具打包时网络连接问题排查与解决

最近线上前端打包时提示 “There appears to be trouble with your network connection”,以此文档记录下排查过程。

前端打包方式

  • docker启动临时容器打包,命令如下
docker run --rm -w /app -v `pwd`:/app alpine-node-common:v16.20-pro sh -c "yarn install && yarn build"
  • Dockfile如下:
FROM alpine:3.16RUN sed -i "s/dl-cdn.alpinelinux.org/mirrors.aliyun.com/g" /etc/apk/repositories \&& apk update && apk upgrade \&& apk add --no-cache nodejs npm && npm install -g yarn \&& npm config set registry https://registry.npmmirror.com \&& yarn config set registry https://registry.npmmirror.com \&& yarn config set ignore-engines true  \&& yarn config set "strict-ssl" false -g \&& rm -rf /var/cache/apk/* && rm -rf /tmp/*CMD ["node"]

排查

  • 一开始想到是容器内的网络问题,容器的默认网络模式是桥接,遂改成主机模式,但仍然还是提示网络问题
docker run --rm --network=host -w /app -v `pwd`:/app alpine-node-common:v16.20-pro sh -c "yarn install && yarn build"
  • 然后就开始排查宿主机的问题,以为是容器内阿里云的镜像不生效,发现网络正常。
dev@localhost:~$ curl -I https://registry.npmmirror.com
HTTP/2 200 
server: Tengine
content-type: application/json; charset=utf-8
content-length: 1264
strict-transport-security: max-age=5184000
date: Fri, 20 Dec 2024 08:42:13 GMT
vary: Origin
....
  • 我又看了一遍报错信息,发现在yarn install的时候,读取的竟然是官方源地址: https://registry.yarnpkg.com,但我在dockerfile中修改了源为阿里云的镜像源。
yarn install v1.22.22
[1/4] Resolving packages...
warning unplugin-auto-import > magic-string > sourcemap-codec@1.4.8: Please use @jridgewell/sourcemap-codec instead
[2/4] Fetching packages...
info There appears to be trouble with your network connection. Retrying...
info There appears to be trouble with your network connection. Retrying...
info There appears to be trouble with your network connection. Retrying...
info There appears to be trouble with your network connection. Retrying...
info There appears to be trouble with your network connection. Retrying...
info There appears to be trouble with your network connection. Retrying...
info There appears to be trouble with your network connection. Retrying...
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
error Error: https://registry.yarnpkg.com/tslib/-/tslib-2.3.1.tgz: ETIMEDOUTat Timeout._onTimeout (/usr/local/lib/node_modules/yarn/lib/cli.js:142070:19)at listOnTimeout (node:internal/timers:559:17)at processTimers (node:internal/timers:502:7)
info There appears to be trouble with your network connection. Retrying...
info There appears to be trouble with your network connection. Retrying...

AI解惑

  • 我先看了项目的yarn.lock文件,发现也是官方源地址: https://registry.yarnpkg.com,此时报错差不多明白了。由于官方源站在国外,国内访问速度极慢,导致下载超市才会提示网络问题. 但我仍然不理解,设置了阿里云的源下载仍会去官方源地址下载,遂去问了AI。

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

解决

至此算是明白为何明明设置了阿里云镜像源,仍会打包失败了,遂让前端同事把yarn.lock文件的地址批量修改为阿里云镜像源地址即可,问题解决!

总结

关于yarn.lock文件中地址的访问流程:

  • 如果是第一次运行项目,yarn会读取yarn config list中设置的registry的地址来下载依赖,如果没设置则使用官方源地址。
  • 如果是已有项目安装依赖,有yarn.lock文件则直接读取,不会在读取yarn config list中设置的registry的地址了。

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

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

相关文章

IIC I2C子协议 SMBus协议 通信协议原理 时序 SMBus深度剖析

引言:系统管理总线(SMBus)是一种双线接口,通过该接口,各种系统组件芯片和设备可以相互以及与系统其他部分通信。它基于IC总线的操作原理。附录B提供了一些SMBus特性与IC总线不同的方式的描述。 SMBus为系统和电源管理相…

【Lua热更新】上篇

Lua 热更新 - 上篇 下篇链接:【Lua热更新】下篇 文章目录 Lua 热更新 - 上篇一、AssetBundle1.理论2. AB包资源加载 二、Lua 语法1. 简单数据类型2.字符串操作3.运算符4.条件分支语句5.循环语句6.函数7. table数组8.迭代器遍历9.复杂数据类型 - 表9.1字典9.2类9.3…

React图标库: 使用React Icons实现定制化图标效果

React图标库: 使用React Icons实现定制化图标效果 图标库介绍 是一个专门为React应用设计的图标库,它包含了丰富的图标集合,覆盖了常用的图标类型,如FontAwesome、Material Design等。React Icons可以让开发者在React应用中轻松地添加、定制各…

如何使用 WebAssembly 扩展后端应用

1. WebAssembly 简介 随着互联网的发展,越来越多的应用借助 Javascript 转到了 Web 端,但人们也发现,随着移动互联网的兴起,需要把大量的应用迁移到手机端,随着手端的应用逻辑越来越复杂,Javascript 的解析…

Fastdfs V6.12.1集群部署(arm/x86均可用)

文章目录 一、 Fastdfs 介绍二、部署 信息三、步骤tracker/storage 机器的 compose 内容storage 机器的 composetracker 与 storage 启动目录层级与配置文件测试测试集群扩容与缩减注意事项 一、 Fastdfs 介绍 FastDFS 是一款高性能的分布式文件系统,特别适合用于存…

maven-resources-production:ratel-fast: java.lang.IndexOutOfBoundsException

Maven生产环境中遇到java.lang.IndexOutOfBoundsException的问题,尝试了重启电脑、重启IDEA等常规方法无效,最终通过直接重建工程解决了问题。 Rebuild Project 再启动OK

1. JasperSoft介绍与安装

Jaspersoft介绍 Jaspersoft是一款开源的,强大灵活并且使用广泛的报表软件。能够展示丰富的页面内容,并将之转换成PDF、HTML或者XML格式,该库完全由Java写出,可以用于在各种Java应用程序,非常适合Java开发者用来做报表生…

知网研学 | 知网文献(CAJ+PDF)批量下载

知网文献(CAJPDF)批量下载 一、知网研学安装二、插件及脚本安装三、CAJ批量下载四、脚本下载及PDF批量下载浏览器取消拦截窗口 一、知网研学安装 批量下载知网文件,格式为es6文件,需使用知网研学软件打开,故需先安装该…

WeakAuras NES Script(lua)

WeakAuras NES Script 修星脚本字符串 脚本1:NES !WA:2!TMZFWXX1zDxVAs4siiRKiBN4eV(sTRKZ5Z6opYbhQQSoPtsxr(K8ENSJtS50(J3D7wV3UBF7E6hgmKOXdjKsgAvZFaPTtte0mD60XdCmmecDMKruyykDcplAZiGPfWtSsag6myGuOuq89EVDV9wPvKeGBM7U99EFVVVV33VFFB8Z2TJ8azYMlZj7Ur3QDR(…

[数据结构] 链表

目录 1.链表的基本概念 2.链表的实现 -- 节点的构造和链接 节点如何构造? 如何将链表关联起来? 3.链表的方法(功能) 1).display() -- 链表的遍历 2).size() -- 求链表的长度 3).addFirst(int val) -- 头插法 4).addLast(int val) -- 尾插法 5).addIndex -- 在任意位置…

springmvc的拦截器,全局异常处理和文件上传

拦截器: 拦截不符合规则的,放行符合规则的。 等价于过滤器。 拦截器只拦截controller层API接口。 如何定义拦截器。 定义一个类并实现拦截器接口 public class MyInterceptor implements HandlerInterceptor {public boolean preHandle(HttpServletRequest reque…

RestTemplate远程调用、服务注册、

一.RestTemplate Spring给我们提供了一个RestTemplate的API,可以方便的实现Http请求的发送。 同步客户端执行HTTP请求,在底层HTTP客户端库(如JDK HttpURLConnection、Apache HttpComponents等)上公开一个简单的模板方法API。RestTemplate通过HTTP方法为常…

台球助教平台系统开发APP和小程序信息收藏功能需求解析(第十二章)

以下是开发台球助教系统客户端(APP,小程序,H5)几端的信息收藏功能的详细需求和功能说明,内容比较详细,可以说是一个教科书式的详细说明了,这套需求说明不仅仅用在我们的台球助教系统程序上&…

React系列(八)——React进阶知识点拓展

前言 在之前的学习中,我们已经知道了React组件的定义和使用,路由配置,组件通信等其他方法的React知识点,那么本篇文章将针对React的一些进阶知识点以及React16.8之后的一些新特性进行讲解。希望对各位有所帮助。 一、setState &am…

【开源免费】基于SpringBoot+Vue.JS房屋租赁管理系统(JAVA毕业设计)

本文项目编号 T 091 ,文末自助获取源码 \color{red}{T091,文末自助获取源码} T091,文末自助获取源码 目录 一、系统介绍二、数据库设计三、配套教程3.1 启动教程3.2 讲解视频3.3 二次开发教程 四、功能截图五、文案资料5.1 选题背景5.2 国内…

netcore 集成Prometheus

一、安装包 <ItemGroup><PackageReference Include"prometheus-net" Version"8.2.1" /><PackageReference Include"prometheus-net.AspNetCore" Version"8.2.1" /> </ItemGroup> 二、添加代码 #region Pro…

CLION中运行远程的GUI程序

在CLION中运行远程GUI程序&#xff0c;很有可能会遇到下面错误 Gtk-WARNING **: cannot open display: 这是因为远程的GUI程序不能再本地机器上显示。这个问题一般有两种解决方法 通过SSH的ForwardX11的方法&#xff0c;就是将远程的GUI程序显示到本地机器上&#xff0c;一般在…

datasets 笔记:加载数据集(基本操作)

参考了huggingface的教程 1 了解数据集基本信息&#xff08; load_dataset_builder&#xff09; 在下载数据集之前&#xff0c;通常先快速了解数据集的基本信息会很有帮助。数据集的信息存储在 DatasetInfo 中&#xff0c;可能包括数据集描述、特征和数据集大小等信息。&…

Java期末复习暨学校第十三次上机课作业

Java期末复习暨学校第十三次上机课作业&#xff1a; &#xff08;1&#xff09;&#xff1a;掌握正则表达式的使用 第一题&#xff1a; 第13行代码为正则表达式&#xff0c;中国内地的手机号必须是11个数字&#xff1a; &#xff08;1&#xff09; ^1&#xff1a;是该电话号码…

aosp15 - Activity生命周期切换

本文探查的是&#xff0c;从App冷启动后到MainActivity生命周期切换的系统实现。 调试步骤 在com.android.server.wm.RootWindowContainer#attachApplication 方法下断点&#xff0c;为了attach目标进程在com.android.server.wm.ActivityTaskSupervisor#realStartActivityLock…