关于npm的钩子函数

一、npm scripts 的生命周期钩子(Lifecycle Scripts)

npm 提供了一些 ​​特殊的 script 名称​​,它们是 ​​生命周期钩子​​,会在特定时机 ​​自动执行​​。这些钩子包括:

1.prepublishOnly(在 npm publish之前执行(仅发布前))

2.prepublish((已废弃,不推荐使用)在打包或发布前执行)

3.prepare(在 npm publish或 npm install(本地安装)时执行,包括 git clone后的安装)

4.preinstall(在安装依赖之前执行)

5.install(安装依赖时执行)

6.postinstall(在安装依赖之后执行(最常用的钩子之一))

7.preuninstall(在卸载包之前执行)

8.uninstall(在卸载包时执行)

9.postuninstall(在卸载包之后执行)

10.preversion(在修改版本号之前执行(比如 npm version patch))

11.version(修改版本号时执行)

12,postversion(修改版本号之后执行)

13.pretest(在运行 npm test之前执行)

14.test(运行测试)

15.posttest(在运行 npm test之后执行)

16.prestop(在运行 npm stop之前执行)

17.stop(停止服务)

18.poststop(在运行 npm stop之后执行)

19.prestart(在运行 npm start之前执行)

20.start(启动服务)

21.poststart(在运行 npm start之后执行)

22.prerestart(在运行 npm restart之前执行)

23.restart(重启服务)

24.postrestart(在运行 npm restart之后执行)

二、与 npm run build相关的钩子

虽然 build本身不是 npm 的生命周期钩子,但如果你在 package.json的 scripts中按如下方式定义了多个脚本:

javascript 复制代码
{
  "scripts": {
    "prebuild": "echo '即将开始构建...'",
    "build": "webpack --mode production",
    "postbuild": "echo '构建完成!'"
  }
}

那么当你运行: npm run build

在 npm 中,当你运行 npm run build命令时,npm 会根据你项目中的 package.json文件里 scripts字段下定义的 build脚本来执行相应的命令。但除了你显式定义的 build脚本本身,npm 还会在脚本执行 ​​前后​​ 自动触发一些 ​​生命周期钩子(Lifecycle Hooks)​​,这些钩子是 npm 内置的机制,在特定阶段自动运行。

不过,​​npm 默认并不会在运行 npm run build时自动执行额外的钩子,除非你显式地在 package.json的 scripts中定义了它们,或者它们是 npm 生命周期脚本中与 build相关联的钩子。​​

一、npm scripts 的生命周期钩子(Lifecycle Scripts)

npm 提供了一些 ​​特殊的 script 名称​​,它们是 ​​生命周期钩子​​,会在特定时机 ​​自动执行​​。这些钩子包括:

钩子名称

触发时机

prepublishOnly

在 npm publish之前执行(仅发布前)

prepublish

(已废弃,不推荐使用)在打包或发布前执行

prepare

在 npm publish或 npm install(本地安装)时执行,包括 git clone后的安装

preinstall

在安装依赖之前执行

install

安装依赖时执行

postinstall

在安装依赖之后执行(最常用的钩子之一)

preuninstall

在卸载包之前执行

uninstall

在卸载包时执行

postuninstall

在卸载包之后执行

preversion

在修改版本号之前执行(比如 npm version patch)

version

修改版本号时执行

postversion

修改版本号之后执行

pretest

在运行 npm test之前执行

test

运行测试

posttest

在运行 npm test之后执行

prestop

在运行 npm stop之前执行

stop

停止服务

poststop

在运行 npm stop之后执行

prestart

在运行 npm start之前执行

start

启动服务

poststart

在运行 npm start之后执行

prerestart

在运行 npm restart之前执行

restart

重启服务

postrestart

在运行 npm restart之后执行

⚠️ 注意:​​build不是 npm 的内置生命周期钩子​​,它只是一个普通的自定义脚本名称,除非你自己定义了它。

二、与 npm run build相关的钩子

虽然 build本身不是 npm 的生命周期钩子,但如果你在 package.json的 scripts中按如下方式定义了多个脚本:

{

"scripts": {

"prebuild": "echo '即将开始构建...'",

"build": "webpack --mode production",

"postbuild": "echo '构建完成!'"

}

}

那么当你运行:npm run build

npm 会 ​​自动按顺序执行以下脚本​​:

1.​​prebuild​​(如果定义了)→ 在运行 build之前执行

2.​​build​​ → 你显式运行的主要构建脚本

3.postbuild​​(如果定义了)→ 在运行 build之后执行

三、额外说明

•​​pre和 post钩子不仅适用于 build,也适用于其他自定义脚本​​,比如 prestart/ start/ poststart,或者 pretest/ test/ posttest等。

•​​这些钩子是 npm 的内置功能,不需要安装任何插件​​。

相关推荐
敲敲了个代码5 小时前
从硬编码到 Schema 推断:前端表单开发的工程化转型
前端·javascript·vue.js·学习·面试·职场和发展·前端框架
dly_blog7 小时前
Vue 响应式陷阱与解决方案(第19节)
前端·javascript·vue.js
消失的旧时光-19437 小时前
401 自动刷新 Token 的完整架构设计(Dio 实战版)
开发语言·前端·javascript
console.log('npc')7 小时前
Table,vue3在父组件调用子组件columns列的方法展示弹窗文件预览效果
前端·javascript·vue.js
用户47949283569157 小时前
React Hooks 的“天条”:为啥绝对不能写在 if 语句里?
前端·react.js
我命由我123458 小时前
SVG - SVG 引入(SVG 概述、SVG 基本使用、SVG 使用 CSS、SVG 使用 JavaScript、SVG 实例实操)
开发语言·前端·javascript·css·学习·ecmascript·学习方法
用户47949283569158 小时前
给客户做私有化部署,我是如何优雅搞定 NPM 依赖管理的?
前端·后端·程序员
C_心欲无痕8 小时前
vue3 - markRaw标记为非响应式对象
前端·javascript·vue.js
qingyun9899 小时前
深度优先遍历:JavaScript递归查找树形数据结构中的节点标签
前端·javascript·数据结构
熬夜敲代码的小N9 小时前
Vue (Official)重磅更新!Vue Language Tools 3.2功能一览!
前端·javascript·vue.js