十分钟分享:处理pnpm imagemin等依赖的二进制安装问题

前几天写了个项目中的图片压缩替换工具用了下imagemin发现有些依赖问题处理了下,简单分享下处理方式

imagemin应该很多人都知道,它是一个基于C++的图片压缩模块。其可支持多种图片格式,在node图片处理领域可谓是常青树。

但是在国内它有很有一个非常严重的问题,一些核心依赖的二进制文件老是下载不下来。今天我主要来分享一下这种情况怎么处理

方法一:cnpm

如果你的项目不关心包管理工具的话,直接使用cnpm安装imagemin的核心插件即可

方法二:依赖修改

cnpm对于项目来说基本快要被淘汰掉了,我也不希望变换自己的管理工具,我喜欢pnpm不想去变动

那么我们就需要去研究一下,为什么cnpm能安装下来,为什么pnpm就安装不下来

首先说cnpm为什么能安装下来?

大部分含有二进制的依赖基本都是因为二进制文件的下载问题导致安装失败(eg:node-sass等)。cnpm对于有些二进制文件会改变其下载地址使其走向国内源,可保证其正常安装

再具体看一下pnpm为啥下载不下来?

拿png的处理依赖来说,一般都会卡在pngquant-bin依赖的postinstallhook中,这个hook脚本主要是使用bin-wrapper来下载二进制文件

bin-wrapper 是一个用于简化二进制文件的安装和使用的工具。

我们要修改的就是这里的二进制文件指向,把这个指向转到taobao的镜像。你可以自己fork这个pngquant-bin去改动,不过需要修改的依赖包相当多不建议这样做。

幸好有个老哥另辟新径,直接改造了下bin-wrapper。在这里进行了链接的镜像指向 【github.com/best-shot/b...】

那接下来我们要做的就是项目依赖安装的时候修正依赖树。因为我使用的pnpm,pnpm本身有一些hook函数。我们就直接可以在这里处理

创建.pnpmfile.cjs文件,将bin-wrapper转换为bin-wrapper-china

javascript 复制代码
module.exports = {
    hooks: {
        readPackage(packageJson) {

            if (packageJson.dependencies && packageJson.dependencies['bin-wrapper']) {
                console.log('当前依赖名称:',packageJson.name, '需要转化');
                packageJson.dependencies['bin-wrapper'] = 'npm:bin-wrapper-china';
            }
            return packageJson;
        },

    }
};

或者你也可以使用pnpm的overrides

json 复制代码
{
  "pnpm": {
    "overrides": {
      "*bin-wrapper": "npm:bin-wrapper-china"
    }
  },
}

yarn的话则是resolutions

json 复制代码
{
  "resolutions": {
    "**/bin-wrapper": "npm:bin-wrapper-china"
  }
}
相关推荐
椒哥11 小时前
一天被问几十次"允许",我统计了 517 次,然后写了个插件
前端·javascript·github
风骏时光牛马11 小时前
生成一个AI稳定性治理及疑难问题分析标题,只需要一个标题,不需要其他的任何文本。
前端
莫西干式秃头11 小时前
用 AI + threejs 写了个浏览器里的 3D 动作游戏《武来》:砍怪、放技能、开 SU7
前端·人工智能·three.js
kyriewen11 小时前
我测了 6 种防请求竞态的写法:只有 1 种真能打
前端·javascript·程序员
孟健11 小时前
用 WorkBuddy 做个人名片网页,挂上开源设计技能后效果完全不同了
前端·人工智能·ai编程
IT_陈寒11 小时前
SpringBoot自动配置的坑,这次终于爬出来了
前端·人工智能·后端
LuHang12 小时前
从天地图切换到高德地图:一次真实的底图迁移实战
前端·vue.js·cesium
用户3600555790013 小时前
Kestrel_VLLM - 27 · 寄存器常驻与融合发射:两次「少发一次」
前端
前端小万13 小时前
用"道法术器"重构你和 AI 的协作方式
前端·人工智能·程序员
鶴哥只手遮天13 小时前
Angular 22 源码级深度解析-第 06 章 模板指令全解:`ɵɵelementStart`、`ɵɵproperty`、`ɵɵadvance` 与绑定指令
前端·开源·angular.js