@lytjs/hmr 6.5.0

package/README.md

@@ -0,0 +1,79 @@
+# @lytjs/hmr
+
+LytJS 热模块替换（Hot Module Replacement）支持。
+
+## 安装
+
+```bash
+pnpm add -D @lytjs/hmr
+```
+
+## 快速开始
+
+```typescript
+import { createHMRClient, getHMRClient, accept } from '@lytjs/hmr';
+
+// 创建 HMR 客户端
+const client = createHMRClient({
+  url: 'ws://localhost:5173',
+  autoConnect: true,
+});
+
+// 或者使用全局单例
+const globalClient = getHMRClient();
+
+// 接受模块更新
+accept('/path/to/module.ts', (update) => {
+  console.log('模块已更新：', update);
+});
+```
+
+## 特性
+
+- WebSocket 连接管理
+- 模块更新处理
+- 自动重连
+- 状态保持
+
+## API
+
+### createHMRClient(options)
+
+创建 HMR 客户端实例。
+
+```typescript
+import { createHMRClient } from '@lytjs/hmr';
+
+const client = createHMRClient({
+  url: 'ws://localhost:5173',
+  autoConnect: true,
+});
+```
+
+### getHMRClient(options)
+
+获取全局 HMR 客户端单例。
+
+### accept(path, handler)
+
+注册模块更新处理函数。
+
+### dispose(path, handler)
+
+注册模块清理函数。
+
+### client.connect()
+
+连接到 HMR 服务器。
+
+### client.disconnect()
+
+断开连接。
+
+### client.send(message)
+
+发送消息。
+
+## 许可证
+
+MIT

package/dist/index.cjs

@@ -0,0 +1,179 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.ts
+var index_exports = {};
+__export(index_exports, {
+  accept: () => accept,
+  createHMRClient: () => createHMRClient,
+  dispose: () => dispose,
+  getHMRClient: () => getHMRClient
+});
+module.exports = __toCommonJS(index_exports);
+var HMRClient = class {
+  constructor(options = {}) {
+    this.ws = null;
+    this.handlers = /* @__PURE__ */ new Map();
+    this.isConnected = false;
+    this.options = {
+      url: options.url || "ws://localhost:5173",
+      autoConnect: options.autoConnect !== false
+    };
+    if (this.options.autoConnect) {
+      this.connect();
+    }
+  }
+  /**
+   * 连接到 HMR 服务器
+   */
+  connect() {
+    if (this.ws) {
+      this.ws.close();
+    }
+    console.log("[HMR] Connecting to", this.options.url);
+    try {
+      this.ws = new WebSocket(this.options.url);
+      this.ws.onopen = () => {
+        this.isConnected = true;
+        console.log("[HMR] Connected");
+        this.dispatch({ type: "connected" });
+      };
+      this.ws.onmessage = (event) => {
+        this.handleMessage(event.data);
+      };
+      this.ws.onclose = () => {
+        this.isConnected = false;
+        console.log("[HMR] Disconnected, reconnecting in 2s...");
+        setTimeout(() => this.connect(), 2e3);
+      };
+      this.ws.onerror = (error) => {
+        console.error("[HMR] WebSocket error", error);
+      };
+    } catch (error) {
+      console.error("[HMR] Connection failed", error);
+      setTimeout(() => this.connect(), 2e3);
+    }
+  }
+  /**
+   * 处理消息
+   */
+  handleMessage(data) {
+    try {
+      const message = JSON.parse(data);
+      console.log("[HMR] Received message:", message.type);
+      switch (message.type) {
+        case "update":
+          this.handleUpdate(message.data);
+          break;
+        case "full-reload":
+          this.handleFullReload();
+          break;
+        default:
+          this.dispatch(message);
+          break;
+      }
+    } catch (error) {
+      console.error("[HMR] Failed to parse message", error);
+    }
+  }
+  /**
+   * 处理模块更新
+   */
+  handleUpdate(update) {
+    const handler = this.handlers.get(update.path);
+    if (handler?.accept) {
+      console.log("[HMR] Accepting update for", update.path);
+      handler.accept(update);
+    } else {
+      console.log("[HMR] No handler for", update.path, ", reloading");
+      this.handleFullReload();
+    }
+  }
+  /**
+   * 处理完全重新加载
+   */
+  handleFullReload() {
+    console.log("[HMR] Full reload requested");
+    window.location.reload();
+  }
+  /**
+   * 注册模块处理程序
+   */
+  register(path, handler) {
+    this.handlers.set(path, handler);
+  }
+  /**
+   * 注销模块处理程序
+   */
+  unregister(path) {
+    this.handlers.delete(path);
+  }
+  /**
+   * 发送消息到服务器
+   */
+  send(message) {
+    if (this.ws && this.isConnected) {
+      this.ws.send(JSON.stringify(message));
+    }
+  }
+  /**
+   * 分发事件
+   */
+  dispatch(message) {
+    const event = new CustomEvent("lytjs:hmr", {
+      detail: message
+    });
+    window.dispatchEvent(event);
+  }
+  /**
+   * 断开连接
+   */
+  disconnect() {
+    if (this.ws) {
+      this.ws.close();
+      this.ws = null;
+    }
+  }
+};
+function createHMRClient(options = {}) {
+  return new HMRClient(options);
+}
+var globalClient = null;
+function getHMRClient(options = {}) {
+  if (!globalClient) {
+    globalClient = createHMRClient(options);
+  }
+  return globalClient;
+}
+function accept(path, handler) {
+  const client = getHMRClient();
+  client.register(path, { accept: handler });
+}
+function dispose(path, handler) {
+  const client = getHMRClient();
+  const existing = client["handlers"].get(path) || {};
+  client.register(path, { ...existing, dispose: handler });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  accept,
+  createHMRClient,
+  dispose,
+  getHMRClient
+});

package/dist/index.d.cts

@@ -0,0 +1,114 @@
+/**
+ * @lytjs/hmr - Type definitions
+ */
+interface HMRClientOptions {
+    /** WebSocket URL */
+    url?: string;
+    /** 是否自动连接 */
+    autoConnect?: boolean;
+}
+interface HMRMessage {
+    /** 消息类型 */
+    type: 'connected' | 'update' | 'full-reload' | 'custom';
+    /** 数据 */
+    data?: any;
+}
+interface HMRUpdate {
+    /** 模块路径 */
+    path: string;
+    /** 更新时间戳 */
+    timestamp: number;
+    /** 是否需要保留状态 */
+    preserveState?: boolean;
+}
+interface HMRHandler {
+    /** 接受更新 */
+    accept?: (update: HMRUpdate) => void;
+    /** 处理错误 */
+    error?: (error: Error) => void;
+    /** 清理旧模块 */
+    dispose?: () => void;
+}
+
+/**
+ * @lytjs/hmr - LytJS 热模块替换
+ *
+ * 提供热模块替换的核心功能
+ */
+
+/**
+ * HMR 客户端类
+ */
+declare class HMRClient {
+    private options;
+    private ws;
+    private handlers;
+    private isConnected;
+    constructor(options?: HMRClientOptions);
+    /**
+     * 连接到 HMR 服务器
+     */
+    connect(): void;
+    /**
+     * 处理消息
+     */
+    private handleMessage;
+    /**
+     * 处理模块更新
+     */
+    private handleUpdate;
+    /**
+     * 处理完全重新加载
+     */
+    private handleFullReload;
+    /**
+     * 注册模块处理程序
+     */
+    register(path: string, handler: HMRHandler): void;
+    /**
+     * 注销模块处理程序
+     */
+    unregister(path: string): void;
+    /**
+     * 发送消息到服务器
+     */
+    send(message: HMRMessage): void;
+    /**
+     * 分发事件
+     */
+    private dispatch;
+    /**
+     * 断开连接
+     */
+    disconnect(): void;
+}
+/**
+ * 创建 HMR 客户端
+ *
+ * @param options - 客户端选项
+ * @returns HMR 客户端实例
+ */
+declare function createHMRClient(options?: HMRClientOptions): HMRClient;
+/**
+ * 获取全局 HMR 客户端
+ *
+ * @param options - 客户端选项（首次调用时使用）
+ * @returns HMR 客户端实例
+ */
+declare function getHMRClient(options?: HMRClientOptions): HMRClient;
+/**
+ * HMR 模块接受函数
+ *
+ * @param path - 模块路径
+ * @param handler - 处理程序
+ */
+declare function accept(path: string, handler: (update: HMRUpdate) => void): void;
+/**
+ * HMR 模块清理函数
+ *
+ * @param path - 模块路径
+ * @param handler - 清理函数
+ */
+declare function dispose(path: string, handler: () => void): void;
+
+export { type HMRClientOptions, type HMRHandler, type HMRMessage, type HMRUpdate, accept, createHMRClient, dispose, getHMRClient };

package/dist/index.d.ts

@@ -0,0 +1,114 @@
+/**
+ * @lytjs/hmr - Type definitions
+ */
+interface HMRClientOptions {
+    /** WebSocket URL */
+    url?: string;
+    /** 是否自动连接 */
+    autoConnect?: boolean;
+}
+interface HMRMessage {
+    /** 消息类型 */
+    type: 'connected' | 'update' | 'full-reload' | 'custom';
+    /** 数据 */
+    data?: any;
+}
+interface HMRUpdate {
+    /** 模块路径 */
+    path: string;
+    /** 更新时间戳 */
+    timestamp: number;
+    /** 是否需要保留状态 */
+    preserveState?: boolean;
+}
+interface HMRHandler {
+    /** 接受更新 */
+    accept?: (update: HMRUpdate) => void;
+    /** 处理错误 */
+    error?: (error: Error) => void;
+    /** 清理旧模块 */
+    dispose?: () => void;
+}
+
+/**
+ * @lytjs/hmr - LytJS 热模块替换
+ *
+ * 提供热模块替换的核心功能
+ */
+
+/**
+ * HMR 客户端类
+ */
+declare class HMRClient {
+    private options;
+    private ws;
+    private handlers;
+    private isConnected;
+    constructor(options?: HMRClientOptions);
+    /**
+     * 连接到 HMR 服务器
+     */
+    connect(): void;
+    /**
+     * 处理消息
+     */
+    private handleMessage;
+    /**
+     * 处理模块更新
+     */
+    private handleUpdate;
+    /**
+     * 处理完全重新加载
+     */
+    private handleFullReload;
+    /**
+     * 注册模块处理程序
+     */
+    register(path: string, handler: HMRHandler): void;
+    /**
+     * 注销模块处理程序
+     */
+    unregister(path: string): void;
+    /**
+     * 发送消息到服务器
+     */
+    send(message: HMRMessage): void;
+    /**
+     * 分发事件
+     */
+    private dispatch;
+    /**
+     * 断开连接
+     */
+    disconnect(): void;
+}
+/**
+ * 创建 HMR 客户端
+ *
+ * @param options - 客户端选项
+ * @returns HMR 客户端实例
+ */
+declare function createHMRClient(options?: HMRClientOptions): HMRClient;
+/**
+ * 获取全局 HMR 客户端
+ *
+ * @param options - 客户端选项（首次调用时使用）
+ * @returns HMR 客户端实例
+ */
+declare function getHMRClient(options?: HMRClientOptions): HMRClient;
+/**
+ * HMR 模块接受函数
+ *
+ * @param path - 模块路径
+ * @param handler - 处理程序
+ */
+declare function accept(path: string, handler: (update: HMRUpdate) => void): void;
+/**
+ * HMR 模块清理函数
+ *
+ * @param path - 模块路径
+ * @param handler - 清理函数
+ */
+declare function dispose(path: string, handler: () => void): void;
+
+export { type HMRClientOptions, type HMRHandler, type HMRMessage, type HMRUpdate, accept, createHMRClient, dispose, getHMRClient };

package/dist/index.mjs

@@ -0,0 +1,151 @@
+// src/index.ts
+var HMRClient = class {
+  constructor(options = {}) {
+    this.ws = null;
+    this.handlers = /* @__PURE__ */ new Map();
+    this.isConnected = false;
+    this.options = {
+      url: options.url || "ws://localhost:5173",
+      autoConnect: options.autoConnect !== false
+    };
+    if (this.options.autoConnect) {
+      this.connect();
+    }
+  }
+  /**
+   * 连接到 HMR 服务器
+   */
+  connect() {
+    if (this.ws) {
+      this.ws.close();
+    }
+    console.log("[HMR] Connecting to", this.options.url);
+    try {
+      this.ws = new WebSocket(this.options.url);
+      this.ws.onopen = () => {
+        this.isConnected = true;
+        console.log("[HMR] Connected");
+        this.dispatch({ type: "connected" });
+      };
+      this.ws.onmessage = (event) => {
+        this.handleMessage(event.data);
+      };
+      this.ws.onclose = () => {
+        this.isConnected = false;
+        console.log("[HMR] Disconnected, reconnecting in 2s...");
+        setTimeout(() => this.connect(), 2e3);
+      };
+      this.ws.onerror = (error) => {
+        console.error("[HMR] WebSocket error", error);
+      };
+    } catch (error) {
+      console.error("[HMR] Connection failed", error);
+      setTimeout(() => this.connect(), 2e3);
+    }
+  }
+  /**
+   * 处理消息
+   */
+  handleMessage(data) {
+    try {
+      const message = JSON.parse(data);
+      console.log("[HMR] Received message:", message.type);
+      switch (message.type) {
+        case "update":
+          this.handleUpdate(message.data);
+          break;
+        case "full-reload":
+          this.handleFullReload();
+          break;
+        default:
+          this.dispatch(message);
+          break;
+      }
+    } catch (error) {
+      console.error("[HMR] Failed to parse message", error);
+    }
+  }
+  /**
+   * 处理模块更新
+   */
+  handleUpdate(update) {
+    const handler = this.handlers.get(update.path);
+    if (handler?.accept) {
+      console.log("[HMR] Accepting update for", update.path);
+      handler.accept(update);
+    } else {
+      console.log("[HMR] No handler for", update.path, ", reloading");
+      this.handleFullReload();
+    }
+  }
+  /**
+   * 处理完全重新加载
+   */
+  handleFullReload() {
+    console.log("[HMR] Full reload requested");
+    window.location.reload();
+  }
+  /**
+   * 注册模块处理程序
+   */
+  register(path, handler) {
+    this.handlers.set(path, handler);
+  }
+  /**
+   * 注销模块处理程序
+   */
+  unregister(path) {
+    this.handlers.delete(path);
+  }
+  /**
+   * 发送消息到服务器
+   */
+  send(message) {
+    if (this.ws && this.isConnected) {
+      this.ws.send(JSON.stringify(message));
+    }
+  }
+  /**
+   * 分发事件
+   */
+  dispatch(message) {
+    const event = new CustomEvent("lytjs:hmr", {
+      detail: message
+    });
+    window.dispatchEvent(event);
+  }
+  /**
+   * 断开连接
+   */
+  disconnect() {
+    if (this.ws) {
+      this.ws.close();
+      this.ws = null;
+    }
+  }
+};
+function createHMRClient(options = {}) {
+  return new HMRClient(options);
+}
+var globalClient = null;
+function getHMRClient(options = {}) {
+  if (!globalClient) {
+    globalClient = createHMRClient(options);
+  }
+  return globalClient;
+}
+function accept(path, handler) {
+  const client = getHMRClient();
+  client.register(path, { accept: handler });
+}
+function dispose(path, handler) {
+  const client = getHMRClient();
+  const existing = client["handlers"].get(path) || {};
+  client.register(path, { ...existing, dispose: handler });
+}
+export {
+  accept,
+  createHMRClient,
+  dispose,
+  getHMRClient
+};

package/package.json

@@ -0,0 +1,46 @@
+{
+  "name": "@lytjs/hmr",
+  "version": "6.5.0",
+  "description": "LytJS Hot Module Replacement support",
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.mjs",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.mjs",
+      "require": "./dist/index.cjs"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist"
+  ],
+  "sideEffects": false,
+  "scripts": {
+    "build": "tsup",
+    "dev": "tsup --watch",
+    "test": "vitest run",
+    "type-check": "tsc --noEmit",
+    "lint": "eslint \"src/**/*.ts\"",
+    "clean": "rm -rf dist"
+  },
+  "dependencies": {},
+  "devDependencies": {
+    "tsup": "^8.0.0",
+    "typescript": "^5.4.0",
+    "vitest": "^3.0.0"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://gitee.com/lytjs/lytjs.git",
+    "directory": "packages/ecosystem/packages/hmr"
+  },
+  "keywords": [
+    "lytjs",
+    "hmr",
+    "hot-module-replacement"
+  ]
+}