【源码共读】- 如何生成npm库并实现自动化管理

偶尔冒泡泡
222 阅读2分钟

npm

1. 如何生成 npm 库

我们在项目中安装一些JS库，在package.json中可以找到对应的依赖命名。那我们可以写一些公共的方法制作成安装包npm install吗？答案是可以的。参考作者NewName的掘金文章

  • 代码需要交到新建的gitHub仓库里，License选择MIT,有License才能发布npm包
  • 注册npm账号，注册页面
  • 项目中npm login登录，npm publish发布，项目重名会发布失败
  • 更新npm包使用npm version+npm publish

2. release-it 实现自动化管理

2.1 release-it 是什么

官方的解释是可以进行版本管理并发布到任何地方，可使用它的多功能配置、强大的插件系统和钩子来执行测试、构建或项目发布所需的任何命令。
具体应用到自动发布Git存储和npm包。变更日志生成、GitHub/GitLab发布等。
release-it官网

2.2 release-it 初始化

  • 若执行npm install release-it,则安装的是最新版本15，node版本 >= 14
  • 若node版本 < 14,执行npm install release-it@^14
  • 首次安装推荐执行npm init release-it, 然后会弹出提示，add the release script to package.json，script中会自动添加命令 image.png

2.3 release-it 生成 changelog

安装 changelog 插件，npm i @release-it/conventional-changelog -D image.png

3. npm init release-it 原理

3.1 npm init 和 npm init xxx 的区别

npm init 是初始化一个 npm 包，或者创建 package.json 文件用到的命令。创建 Vue 或 React，都用到了 npm init xxx，但背后的原理实际上是调用了 npx create-xxx,即执行了 xxx 脚本。
npm init xxx和npx create-xxx是一般CLI工具的常用命令

3.2 理解 npx

npx 是 npm_5.2.0版本 新增的命令，>= 此版本会自动安装 npx.
npm 只能管理包的依赖，npx 可以快捷的运用包中的命令工具和其他可执行文件，让项目内部的模块用起来更方便。npx xxx执行，npx 会先找本地寻找xxx:

- 找到了，用本地的版本
- 没找到，直接下载最新版本到临时目录
- 使用结束完全清除，不会在本机或项目留下任何东西，不会污染本机

3.3 源码分析

参考npm 文档 image.png
npm init 和 npx 的执行基本是一致的，他们相对于执行全局命令来说比较大的优势是保证命令模块是最新版的。运行npm init release-it相当于npx create-release-it

4.总结

  • 关注若川老师很久了，终于第一次写了笔记，什么时候开始学习都不算晚。
  • 知道了release-it 这个工具，可以提高开发效率（如打tag、生成changelog）
  • release-it 主要是针对npm管理的，那么在普通项目中如何应用？ 并且所有项目中都可以使用。看到了若川老师的Vue 3.2 发布了，那尤雨溪是怎么发布 Vue.js 的？，上面有写到vue-next/scripts/release.js，看的不太懂，两者有什么关系，后面继续更新研究。

5.参考文章

还在用开发者工具上传小程序? 快来试试 miniprogram-ci 提效摸鱼
npm init @vitejs/app的背后，仅是npm CLI的冰山一角

avatar
文章
阅读
粉丝