🚀 使用 yalc + nodemon 实现本地 NPM 包的高效开发联调
在开发本地 NPM 包(如组件库、工具库、CLI 等)时,频繁地发布 & 引入到其他项目测试是个麻烦事。
这时候我们可以通过 yalc
+ nodemon
实现一套 自动构建 + 自动推送 + 自动联调 的高效流程。
🧰 使用工具简介
工具 | 作用 |
---|---|
yalc | 本地 npm 包管理工具,用于将本地包发布并推送到目标项目进行测试 |
nodemon | 监听源码变化,自动执行命令(如重启服务或重新构建) |
🏗️ 项目结构假设
```bash my-lib/ # 本地开发的 npm 包 my-app/ # 使用 my-lib 的目标项目 ```
🛠️ my-lib 设置步骤
1. 安装依赖
```bash npm install --save-dev yalc nodemon ```
2. 配置 package.json
```json { "scripts": { "build": "tsc", // 或 vite、rollup 等构建命令 "yalc:push": "yalc publish --push", "dev": "nodemon --watch src --ext ts,js,json --exec "npm run build && npm run yalc:push"" } } ```
3. 可选 .nodemon.json
配置(简化脚本)
```json { "watch": ["src"], "ext": "ts,js,json", "exec": "npm run build && npm run yalc:push" } ```
此时 npm run dev
等效于 nodemon
📦 在 my-app 中使用 yalc 包
-
安装
yalc
(只需一次):```bash npm install -g yalc ```
-
在
my-app/
项目中引入包:```bash yalc add my-lib ```
-
后续每次在
my-lib
中运行yalc push
,my-app
会自动获取到最新依赖版本。
🚴♀️ 开发联调流程
-
启动开发命令:
```bash cd my-lib npm run dev ```
-
修改
my-lib/src/
代码后,会自动:- 执行构建命令
- 将包通过
yalc publish --push
更新到my-app
-
my-app
项目中可以立即看到最新效果。
✅ 优点总结
- 不用每次改完代码都
npm publish
yalc
不污染node_modules
,卸载也方便nodemon
自动构建 + 推送,节省大量手动操作时间
🧩 常见扩展用法
用途 | 工具 |
---|---|
构建组件库 | vite , rollup , tsup 等 |
CLI 工具联调 | yalc + nodemon + commander |
UI 组件开发 | yalc + storybook + devApp |
后端服务联调 | yalc + nodemon + express |
💬 补充建议
- 可以把
yalc.lock
加入.gitignore
- 如果是 UI 组件库,也可以用
yalc
同时 push 给多个 demo 项目 - 使用
yalc remove my-lib
来清除依赖
🎉 总结
使用 yalc + nodemon
,可以极大提升本地 NPM 包开发效率,做到代码改动自动同步、实时调试,适合:
- 多项目协作开发
- 组件库、工具库、CLI 开发场景
- 本地联调而不需要频繁发包