如何修改别人的 npm 包并发布自己的修改版本

概述

经常会遇到别人的 npm 包有小 bug 不能及时修复或者不能完全满足需求，需要进行简单的修改。这个时候我们可以给作者提 issue，当然作者可能没时间搭理你。这个时候我们就得自己动手了。

步骤概述

• 1、到 https://www.npmjs.com/ 注册一个账号，记住用户名，后面会用到。（本步骤非必须）；
• 2、clone 别人的代码仓库到本地；
• 3、修改代码；
• 4、发布

步骤拆解

注册 npm 账号

如果你之前就已经注册了就无需关注这一步，点这里 https://www.npmjs.com/signup 直达注册。

我们这里假设你注册的用户为 fly100。

clone 别人的代码仓库到本地

略过不说，如果你不知道 git，你大概率也不会看这篇文章。

修改代码

修改代码本不必说，这里主要想讲一下要修改哪些内容：

• 修复小bug 或者新增一些功能；
• 修改 package.json 中的 name，name 是包的名字；
• 修改代码后，你肯定会发布到一个新的代码仓库，此时应该同步修改 package.json 中的 repository 字段，指向新仓库。

这里有必要说明一下，修改 package.json 中的 name，确保你的包名和原包名不同。假设原包名为 some-pack，那么你可以将你的包名命名为 @fly100/some-pack，其中 fly100 是你的 npm 用户名。

如果你使用 @用户名/包名 这种命名方式的话，你可能还需要修改 package.json 中的 script 中的 release 字段。要加上 --access public

"scripts": {
    "release": "pnpm publish --access public"
 }

注意：可以不加 --access public。因为对作用域包（@scope/pkg）来说，默认就是私有。但是这是需要付费的，所以不想付费的话，就加上吧。

修改代码的一个重要的过程是验证修改的代码，我们在依赖项目中本地引用修改的包，当验证完成之后再发布。每次修改代码，就需要重新 build，这是很耗时的，我们可以 watch 当前包。这个可以通过 pnpm 或者 tsup 来实现。

可以在 scripts 中增加 dev 命令

"scripts": {
    "dev": "pnpm run build --watch"
 }

如果你不使用 tsup，也可以使用下面的命令：

npx tsup --watch

发布

发布之前先需要在控制台登录，命令如下：

npm login

按照提示完成操作之后，执行 npm run release 即可。

补充

在 npm 包未发布之前，在依赖项目中可以本地引用 npm 包，只需在依赖项目的 package.json 中加入：

"dependencies": {
  "@fly100/some-pack": "file:/path/to/some-pack" 
}