如何发布专属于自己的npm包

456 阅读6分钟

欢迎关注作者的微信公众号:奋进的技术人

关注我获得前后端全套学习视频、各种学习资料,以及最及时的技术文章分享

npm(Node Package Manager)是 Node.js 的包管理器,用于管理和分享 JavaScript 代码模块。它是 Node.js 平台的默认包管理工具,也是目前最广泛使用的 JavaScript 包管理器之一。

前端同学平时的项目开发工作中需要给工程安装新的插件时一般都是通过npm install命令安装别人开源的软件代码。那如果我们也想为开源社区作贡献,在开发完软件工具包之后该如何发布到npm包管理仓库,供全球的javascript工程师使用呢?今天我们就来介绍发布npm包的基础到高级的教程,助力每个前端工程师都能有专属于自己的npm开源项目。

执行npm publish发布包

使用以下命令登陆npm账号,执行命令之后输入用户名、密码即可完成登陆操作。

npm login

登陆之后就是发布环节,在项目发布之前最好再检查下package.json配置文件,确保name字段没有问题(要发布的包名需要唯一,否则发布将不成功),且version字段是最新的。keywords字段最好认真填写,因为keywords是你开发的程序的标签,直接影响到你开发的程序被其他程序员检索到的次数,也就是说这是一个和曝光量息息相关的字段。经过检查配置信息没有问题就可以进入项目根目录,使用以下命令发布。

npm publish

发布之后进入npm官网,登录你的账号,你将看到自己发布的开源程序,同时它也将被全球的javascript程序员检索、下载,有没有感觉成就感突然高涨了!

image.png

image.png

版本更新与维护

在软件开发中,版本号的更新是很重要的。版本号可以帮助用户和开发者了解软件的更新状态和内容。版本号的命名原则遵循Semantic Versioning规范,通常由主版本号、次版本号和修订号组成,例如1.2.3。

更新版本号又分为手动更新和自动更新,手动更新操作就比较傻瓜一点,直接打开项目的package.json文件手动更新version字段。自动更新则是通过命令行方法更新,可以直接使用npm version命令更新,如下操作。也可以使用standard-version这样的工具根据提交的commit信息自动更新版本号。

# 自动更新补丁版本号
npm version patch

# 自动更新次版本号
npm version minor

# 自动更新主版本号
npm version major

这些命令会自动更新package.json中的版本号,并创建一个新的Git提交和标签。更新版本号之后重新执行npm publish命令发布即可。

版本更新与维护过程中还有一个环节也很重要,就是README.md、CHANGELOG.md、API文档等文档信息的更新。及时更新这些文档信息可以帮助用户更好的理解软件的新功能、变更和修复。

README.md:添加新功能的描述、使用示例和任何重要的变更说明。

CHANGELOG.md:记录每个版本的变更内容,这有助于用户了解每个版本的更新细节。如果以后想让其他程序员一起参与维护该项目,这个文件也是其他参与者上手的说明书。

API文档:如果插件有API文档,确保所有API的变更都被记录和更新。

CHANGELOG.md文件格式如下:

# Changelog

## [1.1.0] - 2023-01-01
### Added
- Added a new feature that improves performance.

## [1.0.0] - 2022-12-01
### Added
- Initial release of the plugin.

使用np工具简化发布流程

在需要频繁更新npm包版本时,手动执行npm publish显的繁琐又效率低下。此时借助工具的思路依旧是一个省时省力又讨好的思路。这里我们可以使用np这个工具来高效发布npm包。

首先全局安装np工具:

npm install -g np

使用np发布包:

np

执行np命令之后,np工具会自动执行检查流程:

1.检查是否有未提交的更改

2.检查是否有未发布的版本

3.提示选择版本类型(如patch, minor, major)

4.自动更新CHANGELOG.md

5.自动创建git标签

6.自动推送代码和标签到远程仓库

7.最后执行npm publish

是不是感觉省时、省力又讨喜,还不容易出错。

CI/CD环境中自动发布

CI/CD就是我们常说的持续集成、持续部署,使用CI/CD可以帮助团队自动化构建、测试和部署流程。在发布npm包的应用场景下,借助CI/CD工具自动化发布流程依旧是一个很不错的选择。

我们选用GitHub Actions作为CI/CD工具,首先我们先生成GitHub Actions的配置文件。在项目的.github/workflows目录下创建一个YAML文件来定义CI/CD流程。

name: Publish Package

on:
  push:
    tags:
      - 'v*'

jobs:
  publish:
    runs-on: ubuntu-latest
    steps:
    - name: Checkout code
      uses: actions/checkout@v2
    - name: Use Node.js
      uses: actions/setup-node@v1
      with:
        node-version: '14'
    - name: Install dependencies
      run: npm ci
    - name: Build
      run: npm run build
    - name: Publish
      run: npm publish
      env:
        NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

在上面的配置中,每当有新的tag被推送到仓库时,GitHub Actions会自动执行以下步骤:

1.检查代码

2.设置Node.js环境

3.安装依赖

4.构建项目

5.发布npm包

其中,NODE_AUTH_TOKEN是一个环境变量,它包含了用于发布npm包的认证令牌。这个令牌需要预先在GitHub仓库的Secrets中设置。

管理多个注册表账户和私有包

如果开发者需要管理多个npm注册表账户,或者发布私有npm包。则可以使用下面的方法来满足自己的需求。

多用户管理时,可以通过创建多个.npmrc文件来管理不同的npm注册表账户。如,在项目根目录下创建一个名为.npmrc.private的文件,用于配置私有包的发布:

registry=<https://registry.npmjs.com/> //registry.npmjs.com/:\_authToken=your-private-token

发布时,只需切换到该配置文件即可:

npm --registry=<https://registry.npmjs.com/> --userconfig=.npmrc.private publish

发布私有包时,需要先在npm官网上创建一个组织,并设置相应的权限。然后,在发布时,使用组织的命名空间来发布包,这样,发布的包就只能被组织内的成员访问:

npm publish --access=restricted