Hot Hook 项目教程

Hot Hook 项目教程

hot-hook 🪝 Simple HMR for NodeJS + ESM 项目地址: https://gitcode.com/gh_mirrors/ho/hot-hook

1. 项目介绍

Hot Hook 是一个简单且轻量级的库，用于在 Node.js 中添加热模块替换（HMR）功能。HMR 允许开发者在不重启整个服务器的情况下，动态更新代码模块，从而提高开发效率和反馈速度。Hot Hook 支持 ESM（ECMAScript 模块），并且设计得非常轻便，不涉及 AST 解析、代码转换或打包等复杂操作。

2. 项目快速启动

安装

首先，使用 pnpm 安装 Hot Hook：

pnpm add hot-hook

初始化

在项目中初始化 Hot Hook 有两种方式：

使用 --import 标志

如果你使用 ts-node 或 tsx 进行 TypeScript 转译，可以在启动命令中使用 --import 标志：

node --import=tsx --import=hot-hook/register /src/index.ts

使用 hot.init

在 Node.js 应用程序中尽早添加以下代码：

import { hot } from 'hot-hook';

await hot.init({
  root: import.meta.filename, // 设置根文件路径
  // 其他选项
});

配置类型

为了确保 TypeScript 能够识别 import.meta.hot，需要在 tsconfig.json 中添加以下配置：

{
  "compilerOptions": {
    "types": ["hot-hook/import-meta"]
  }
}

3. 应用案例和最佳实践

动态导入模块

在 HTTP 服务器中，通常会动态导入控制器或路由处理模块。每次请求时，Hot Hook 都会检查模块是否需要重新加载：

import * as http from 'http';

const server = http.createServer(async (request, response) => {
  const app = await import('./app.js', {
    assert: { type: 'import.meta.hot', boundary: true }
  });
  app.default(request, response);
});

server.listen(8080);

使用 import.meta.hot

import.meta.hot 提供了一些有用的方法，例如 dispose 和 decline：

if (import.meta.hot) {
  import.meta.hot.dispose(() => {
    // 清理资源
  });
}

4. 典型生态项目

AdonisJS

Hot Hook 特别适用于 AdonisJS 框架。你可以在 examples 文件夹中找到如何在 AdonisJS 中设置 Hot Hook 的示例。

Fastify

对于 Fastify 用户，Hot Hook 同样提供了快速集成的方法。你可以在项目文档中找到详细的配置步骤。

Hono

Hono 是一个轻量级的 Web 框架，Hot Hook 可以帮助你在 Hono 中实现快速的热模块替换。

通过以上步骤，你可以轻松地在 Node.js 项目中集成 Hot Hook，提升开发效率。

hot-hook 🪝 Simple HMR for NodeJS + ESM 项目地址: https://gitcode.com/gh_mirrors/ho/hot-hook