如何用lyo init改造package.json：prepublishOnly钩子让每次npm publish自动编译发布

如何用lyo init改造package.json：prepublishOnly钩子让每次npm publish自动编译发布

【免费下载链接】lyo📦 Node.js to browser - The easy way项目地址: https://gitcode.com/gh_mirrors/lyo/lyo

lyo是一个"零配置"的 Node.js 模块转浏览器库工具，一条lyo init命令就能改造你的package.json：自动写入prepublishOnly钩子，让每次执行npm publish时都自动完成打包、压缩与发布，从此告别"忘记编译导致浏览器用户拿到坏包"的经典事故。

一、30秒认识 lyo 是什么

lyo（取"冻干"之意：lyophilization）把 Node.js 模块变成一个可直接用<script>标签引入的.min.js单文件。它的理念是**"不需要做决策，不需要配置，开箱即用"**——底层自动串联了三件事：

这三步的自动编排逻辑就在 index.js 中串联，具体执行细节在lib/task.js。整个编译过程你只需运行一个命令。

二、lyo init：一条命令改造 package.json

安装并试运行 lyo

npm i -g lyo # 全局安装 lyo # 在你的模块根目录直接试运行

lyo 会读取你package.json的main字段作为入口（默认index.js），输出的文件名取name字段的驼峰形式（逻辑见lib/options.js），例如query-string模块会在浏览器里暴露为queryString。

一键写入配置

确认效果满意后，执行：

lyo init -i lib/main.js -n runMyModule

lyo init会读取package.json并做三件事（核心逻辑在lib/init.js）：

1. 新增 devDependency：把lyo加进devDependencies，保证团队成员环境一致；
2. 写入钩子：创建scripts.prepublishOnly，值为lyo。如果你的项目已有该钩子且不含 lyo，它会被智能改为lyo && 原有脚本，不会覆盖你已有的发布逻辑；
3. 保存默认选项：你传入的-i、-n、-o、-b等参数会被写进package.json的lyo字段，成为以后的默认值。

改造后的package.json长这样：

{ "name": "my-module", "devDependencies": { "lyo": "latest" }, "scripts": { "prepublishOnly": "lyo" }, "lyo": { "input": "lib/main.js", "name": "runMyModule" } }

💡 记得执行npm install让新增的依赖生效。lyo init是幂等的：重复运行会提示 "already configured, nothing has changed"，不会重复改动。

三、prepublishOnly 钩子：自动编译发布的原理

prepublishOnly是 npm 官方生命周期脚本，只在真正执行npm publish时触发（git pull、本地npm install都不会触发），这正是它比老旧prepublish钩子更安全的地方。

有了它，你的发布流程变成：

npm publish # 1. npm 先自动运行 prepublishOnly → 即 lyo # 2. lyo 完成 Browserify + Babel + Uglify，产出 dist/xxx.min.js # 3. dist 里的 bundle 随源码一起推送到 npm 仓库

用户侧只需一行 HTML：

<script src="dist/my-module.min.js"></script> <script> myModule('foo'); </script>

四、配套技巧：给 README 生成用法示例

发布前建议把"浏览器怎么用"写进文档。运行：

lyo usage

它会分析入口文件的导出签名，打印一段<script>示例代码（含本地路径与 CDN 两种引入方式，逻辑见lib/usage.js），复制进README.md即可。

五、常见问题速查

• 忘了提交 dist 文件夹？bundle 是否需要纳入版本库完全由你决定，发布前 lyo 会现场重新编译，保证产物最新。
• 想自定义 Babel？在项目根目录放一个.babelrc，lyo 会自动检测并使用（如transform-remove-console插件），否则默认使用@babel/preset-env。
• 只想编译别人的 npm 模块？无需 init，直接lyo get query-string即可下载并编译，还能指定版本：lyo get joi@13.5.0 --name Joi。
• 支持哪些选项？--input/-i入口文件、--output/-o输出路径、--name/-n浏览器中的模块名、--banner/-b文件头注释，均可在lyo init时一次性固化为默认值。

六、总结

用 lyo 的思路很简单：把"编译到浏览器"这件容易忘的事，变成npm publish不可跳过的一环。一条 init 命令，从此每个版本发布的都是最新的浏览器 bundle。

【免费下载链接】lyo📦 Node.js to browser - The easy way项目地址: https://gitcode.com/gh_mirrors/lyo/lyo