@taro-hmr-compile/plugin-webpack 0.0.1-alpha.5 → 0.0.1-alpha.7

package/dist/patch/hmr-patch-runtime-plugin.js

@@ -10,80 +10,47 @@ const webpack_1 = __importDefault(require("webpack"));
 const PLUGIN_NAME = 'HmrPatchRuntimePlugin';
 const hotRuntimeCode = `
 var applyQueue = Promise.resolve();
-var applySequence = 0;
 
 ${webpack_1.default.RuntimeGlobals.require}.miniHmr = {
-  applyPatch: function(patch) {
-    if (!patch) return Promise.resolve();
+  shouldApplyBootstrapPatch: function(patch) {
+    if (!patch) return false;
+
+    return Object.keys(patch.modules).some(function(moduleId) {
+      return !Object.prototype.hasOwnProperty.call(${webpack_1.default.RuntimeGlobals.moduleFactories}, moduleId);
+    });
+  },
+  applyBootstrapPatch: function(patch) {
+    if (!patch) return [];
 
-    var applyId = ++applySequence;
-    var enqueueHash = ${webpack_1.default.RuntimeGlobals.getFullHash}();
     // 微信要求 Page() 在页面脚本求值期间同步注册。bootstrap 只补齐缺失工厂，
     // 不会覆盖现有模块；必须在 Page Chunk startup 继续执行前同步完成。
-    if (patch.type === 'bootstrap') {
-      var installedModules = [];
-      Object.keys(patch.modules).forEach(function(moduleId) {
-        if (!Object.prototype.hasOwnProperty.call(${webpack_1.default.RuntimeGlobals.moduleFactories}, moduleId)) {
-          ${webpack_1.default.RuntimeGlobals.moduleFactories}[moduleId] = patch.modules[moduleId];
-          installedModules.push(moduleId);
-        }
-      });
-      console.log('[taro-hmr-compile] bootstrap patch installed', {
-        applyId: applyId,
-        installedModules: installedModules
-      });
-      return Promise.resolve(installedModules);
-    }
-
-    console.log('[taro-hmr-compile] patch enqueued', {
-      applyId: applyId,
-      type: patch.type,
-      runtimeHash: enqueueHash,
-      fromHash: patch.fromHash,
-      toHash: patch.toHash
+    var installedModules = [];
+    Object.keys(patch.modules).forEach(function(moduleId) {
+      if (!Object.prototype.hasOwnProperty.call(${webpack_1.default.RuntimeGlobals.moduleFactories}, moduleId)) {
+        ${webpack_1.default.RuntimeGlobals.moduleFactories}[moduleId] = patch.modules[moduleId];
+        installedModules.push(moduleId);
+      }
     });
+    return installedModules;
+  },
+  applyUpdatePatch: function(patch) {
+    if (!patch) return Promise.resolve();
+    
+    globalThis.log('apply update patch %O', patch);
 
     var task = applyQueue.then(function() {
       var runtimeHash = ${webpack_1.default.RuntimeGlobals.getFullHash}();
-      console.log('[taro-hmr-compile] patch dequeued', {
-        applyId: applyId,
-        runtimeHash: runtimeHash,
-        fromHash: patch.fromHash,
-        toHash: patch.toHash,
-        isStaleBaseline: runtimeHash !== patch.fromHash
-      });
 
-      if (runtimeHash === patch.toHash) {
-        console.log('[taro-hmr-compile] patch skipped at target hash', {
-          applyId: applyId,
-          runtimeHash: runtimeHash
-        });
-        return;
-      }
+      if (runtimeHash === patch.toHash) return;
 
       currentUpdateApplyHandlers = [];
 
-      ${webpack_1.default.RuntimeGlobals.require}.miniHmr.preparePatch(
-        patch,
-        currentUpdateApplyHandlers
-      );
+      ${webpack_1.default.RuntimeGlobals.require}.miniHmr.preparePatch(patch, currentUpdateApplyHandlers);
 
       return setStatus('ready')
-        .then(function() {
-          return hotApply();
-        })
+        .then(function() { return hotApply(); })
         .then(function(updatedModules) {
-          ${webpack_1.default.RuntimeGlobals.getFullHash} = function() {
-            return patch.toHash;
-          };
-
-          console.log('[taro-hmr-compile] patch applied', {
-            applyId: applyId,
-            fromHash: patch.fromHash,
-            toHash: patch.toHash,
-            updatedModules: updatedModules
-          });
-
+          ${webpack_1.default.RuntimeGlobals.getFullHash} = function() { return patch.toHash; };
           return updatedModules;
         });
     });
@@ -120,6 +87,10 @@ const injectRuntime = (source, injectedCode) => {
 class HmrPatchRuntimePlugin {
     apply(compiler) {
         compiler.hooks.thisCompilation.tap(PLUGIN_NAME, compilation => {
+            compilation.hooks.additionalTreeRuntimeRequirements.tap(PLUGIN_NAME, (_chunk, runtimeRequirements) => {
+                runtimeRequirements.add(webpack_1.default.RuntimeGlobals.require);
+                runtimeRequirements.add(webpack_1.default.RuntimeGlobals.getFullHash);
+            });
             compilation.hooks.runtimeModule.tap(PLUGIN_NAME, runtimeModule => {
                 const injectedCode = {
                     HotModuleReplacementRuntimeModule: hotRuntimeCode,

package/dist/patch/hmr-patch-runtime-plugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"hmr-patch-runtime-plugin.js","sourceRoot":"","sources":["../../src/patch/hmr-patch-runtime-plugin.ts"],"names":[],"mappings":";;;;;;AAAA,0CAAmC;AACnC,iEAAuC;AACvC,sDAA6B;AAE7B,MAAM,WAAW,GAAG,uBAAuB,CAAA;AAE3C,MAAM,cAAc,GAAG;;;;EAIrB,iBAAO,CAAC,cAAc,CAAC,OAAO;;;;;wBAKR,iBAAO,CAAC,cAAc,CAAC,WAAW;;;;;;oDAMN,iBAAO,CAAC,cAAc,CAAC,eAAe;YAC9E,iBAAO,CAAC,cAAc,CAAC,eAAe;;;;;;;;;;;;;;;;;;;;0BAoBxB,iBAAO,CAAC,cAAc,CAAC,WAAW;;;;;;;;;;;;;;;;;;;QAmBpD,iBAAO,CAAC,cAAc,CAAC,OAAO;;;;;;;;;;YAU1B,iBAAO,CAAC,cAAc,CAAC,WAAW;;;;;;;;;;;;;;;;;;;;;CAqB7C,CAAC;AAEF,MAAM,uBAAuB,GAAG;EAC9B,iBAAO,CAAC,cAAc,CAAC,OAAO;;;;;;;;;;;;;;CAc/B,CAAA;AAED,MAAM,aAAa,GAAG,CAAC,MAAc,EAAE,YAAoB,EAAE,EAAE;IAC3D,MAAM,OAAO,GAAG,IAAA,cAAK,EAAC,MAAM,EAAE,EAAC,UAAU,EAAE,QAAQ,EAAC,CAAC,CAAA;IACrD,MAAM,QAAQ,GAAG,IAAA,cAAK,EAAC,YAAY,EAAE,EAAC,UAAU,EAAE,QAAQ,EAAC,CAAC,CAAA;IAE5D,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;IAEnD,OAAO,IAAA,mBAAQ,EAAC,OAAO,CAAC,CAAC,IAAI,CAAA;AACjC,CAAC,CAAA;AAED,MAAa,qBAAqB;IAC9B,KAAK,CAAC,QAA0B;QAC5B,QAAQ,CAAC,KAAK,CAAC,eAAe,CAAC,GAAG,CAC9B,WAAW,EACX,WAAW,CAAC,EAAE;YACV,WAAW,CAAC,KAAK,CAAC,aAAa,CAAC,GAAG,CAC/B,WAAW,EACX,aAAa,CAAC,EAAE;gBACZ,MAAM,YAAY,GAAG;oBACjB,iCAAiC,EAAE,cAAc;oBACjD,8BAA8B,EAAE,uBAAuB;iBAC1D,CAAC,aAAa,CAAC,WAAW,CAAC,IAAI,CAAC,CAAA;gBAEjC,IAAI,CAAC,YAAY;oBAAE,OAAM;gBAEzB,MAAM,QAAQ,GAAG,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;gBAE3D,aAAa,CAAC,QAAQ,GAAG,GAAG,EAAE;oBAC1B,MAAM,MAAM,GAAG,QAAQ,EAAE,CAAA;oBAEzB,IAAI,CAAC,MAAM;wBAAE,OAAO,MAAM,CAAA;oBAE1B,OAAO,aAAa,CAAC,MAAM,EAAE,YAAY,CAAC,CAAA;gBAC9C,CAAC,CAAA;YACL,CAAC,CACJ,CAAA;QACL,CAAC,CACJ,CAAA;IACL,CAAC;CACJ;AA7BD,sDA6BC"}
+{"version":3,"file":"hmr-patch-runtime-plugin.js","sourceRoot":"","sources":["../../src/patch/hmr-patch-runtime-plugin.ts"],"names":[],"mappings":";;;;;;AAAA,0CAAmC;AACnC,iEAAuC;AACvC,sDAA6B;AAE7B,MAAM,WAAW,GAAG,uBAAuB,CAAA;AAE3C,MAAM,cAAc,GAAG;;;EAGrB,iBAAO,CAAC,cAAc,CAAC,OAAO;;;;;qDAKqB,iBAAO,CAAC,cAAc,CAAC,eAAe;;;;;;;;;;kDAUzC,iBAAO,CAAC,cAAc,CAAC,eAAe;UAC9E,iBAAO,CAAC,cAAc,CAAC,eAAe;;;;;;;;;;;;0BAYtB,iBAAO,CAAC,cAAc,CAAC,WAAW;;;;;;QAMpD,iBAAO,CAAC,cAAc,CAAC,OAAO;;;;;YAK1B,iBAAO,CAAC,cAAc,CAAC,WAAW;;;;;;;;;;;CAW7C,CAAC;AAEF,MAAM,uBAAuB,GAAG;EAC9B,iBAAO,CAAC,cAAc,CAAC,OAAO;;;;;;;;;;;;;;CAc/B,CAAA;AAED,MAAM,aAAa,GAAG,CAAC,MAAc,EAAE,YAAoB,EAAE,EAAE;IAC3D,MAAM,OAAO,GAAG,IAAA,cAAK,EAAC,MAAM,EAAE,EAAC,UAAU,EAAE,QAAQ,EAAC,CAAC,CAAA;IACrD,MAAM,QAAQ,GAAG,IAAA,cAAK,EAAC,YAAY,EAAE,EAAC,UAAU,EAAE,QAAQ,EAAC,CAAC,CAAA;IAE5D,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;IAEnD,OAAO,IAAA,mBAAQ,EAAC,OAAO,CAAC,CAAC,IAAI,CAAA;AACjC,CAAC,CAAA;AAED,MAAa,qBAAqB;IAC9B,KAAK,CAAC,QAA0B;QAC5B,QAAQ,CAAC,KAAK,CAAC,eAAe,CAAC,GAAG,CAC9B,WAAW,EACX,WAAW,CAAC,EAAE;YACV,WAAW,CAAC,KAAK,CAAC,iCAAiC,CAAC,GAAG,CAAC,WAAW,EAAE,CAAC,MAAM,EAAE,mBAAmB,EAAE,EAAE;gBACjG,mBAAmB,CAAC,GAAG,CAAC,iBAAO,CAAC,cAAc,CAAC,OAAO,CAAC,CAAA;gBACvD,mBAAmB,CAAC,GAAG,CAAC,iBAAO,CAAC,cAAc,CAAC,WAAW,CAAC,CAAA;YAC/D,CAAC,CAAC,CAAA;YAEF,WAAW,CAAC,KAAK,CAAC,aAAa,CAAC,GAAG,CAAC,WAAW,EAAE,aAAa,CAAC,EAAE;gBAC7D,MAAM,YAAY,GAAG;oBACjB,iCAAiC,EAAE,cAAc;oBACjD,8BAA8B,EAAE,uBAAuB;iBAC1D,CAAC,aAAa,CAAC,WAAW,CAAC,IAAI,CAAC,CAAA;gBAEjC,IAAI,CAAC,YAAY;oBAAE,OAAM;gBAEzB,MAAM,QAAQ,GAAG,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;gBAE3D,aAAa,CAAC,QAAQ,GAAG,GAAG,EAAE;oBAC1B,MAAM,MAAM,GAAG,QAAQ,EAAE,CAAA;oBAEzB,IAAI,CAAC,MAAM;wBAAE,OAAO,MAAM,CAAA;oBAE1B,OAAO,aAAa,CAAC,MAAM,EAAE,YAAY,CAAC,CAAA;gBAC9C,CAAC,CAAA;YACL,CAAC,CAAC,CAAA;QACN,CAAC,CACJ,CAAA;IACL,CAAC;CACJ;AA/BD,sDA+BC"}

package/dist/server/hmr-server-plugin.js

@@ -1,8 +1,19 @@
 "use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.HmrServerPlugin = void 0;
 const compiler_1 = require("@taro-hmr-compile/core/compiler");
 const hmr_compiler_plugin_1 = require("../compile/hmr-compiler-plugin");
+const log_1 = require("../log");
+const serverLog = log_1.log.extend('HmrServerPlugin');
 const PLUGIN_NAME = 'HmrServerPlugin';
 class HmrServerPlugin extends compiler_1.HmrCompileServer {
     constructor(options) {
@@ -11,15 +22,17 @@ class HmrServerPlugin extends compiler_1.HmrCompileServer {
     }
     apply(compiler) {
         this.compiler = compiler;
-        compiler.hooks.afterEmit.tap(PLUGIN_NAME, compilation => {
-            var _a;
-            const isSuccessful = compilation.errors.length === 0 && Boolean(compilation.hash);
-            if (isSuccessful && !this.isServerRunning)
-                this.start((_a = this.options.port) !== null && _a !== void 0 ? _a : 8080, this.options.host);
-        });
+        compiler.hooks.beforeCompile.tapPromise(PLUGIN_NAME, () => __awaiter(this, void 0, void 0, function* () {
+            if (this.isServerRunning)
+                return;
+            const { port = 8080, host } = this.options;
+            serverLog('start server %O', { port, host });
+            yield this.start(port, host);
+        }));
         compiler.hooks.watchClose.tap(PLUGIN_NAME, () => this.stop());
     }
     compile(page) {
+        serverLog('receive compile %s', page);
         if (!this.compiler)
             throw new Error('[taro-hmr-compile] Compiler 尚未初始化');
         hmr_compiler_plugin_1.HmrCompilerPlugin.getCompilerHooks(this.compiler).compileRequested.call(page);

package/dist/server/hmr-server-plugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"hmr-server-plugin.js","sourceRoot":"","sources":["../../src/server/hmr-server-plugin.ts"],"names":[],"mappings":";;;AAAA,8DAAgE;AAEhE,wEAAgE;AAEhE,MAAM,WAAW,GAAG,iBAAiB,CAAA;AAOrC,MAAa,eAAgB,SAAQ,2BAAgB;IAGjD,YAA6B,OAA+B;QACxD,KAAK,EAAE,CAAA;QADkB,YAAO,GAAP,OAAO,CAAwB;IAE5D,CAAC;IAED,KAAK,CAAC,QAAkB;QACpB,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAA;QAExB,QAAQ,CAAC,KAAK,CAAC,SAAS,CAAC,GAAG,CAAC,WAAW,EAAE,WAAW,CAAC,EAAE;;YACpD,MAAM,YAAY,GAAG,WAAW,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC,IAAI,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,CAAA;YACjF,IAAI,YAAY,IAAI,CAAC,IAAI,CAAC,eAAe;gBAAE,IAAI,CAAC,KAAK,CAAC,MAAA,IAAI,CAAC,OAAO,CAAC,IAAI,mCAAI,IAAI,EAAE,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;QACvG,CAAC,CAAC,CAAA;QAEF,QAAQ,CAAC,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC,WAAW,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAA;IACjE,CAAC;IAEQ,OAAO,CAAC,IAAY;QACzB,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,MAAM,IAAI,KAAK,CAAC,mCAAmC,CAAC,CAAA;QACxE,uCAAiB,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IACjF,CAAC;CACJ;AAtBD,0CAsBC"}
+{"version":3,"file":"hmr-server-plugin.js","sourceRoot":"","sources":["../../src/server/hmr-server-plugin.ts"],"names":[],"mappings":";;;;;;;;;;;;AAAA,8DAAgE;AAEhE,wEAAgE;AAChE,gCAA2B;AAE3B,MAAM,SAAS,GAAG,SAAG,CAAC,MAAM,CAAC,iBAAiB,CAAC,CAAA;AAE/C,MAAM,WAAW,GAAG,iBAAiB,CAAA;AAOrC,MAAa,eAAgB,SAAQ,2BAAgB;IAGjD,YAA6B,OAA+B;QACxD,KAAK,EAAE,CAAA;QADkB,YAAO,GAAP,OAAO,CAAwB;IAE5D,CAAC;IAED,KAAK,CAAC,QAAkB;QACpB,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAA;QAExB,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC,UAAU,CAAC,WAAW,EAAE,GAAS,EAAE;YAC5D,IAAI,IAAI,CAAC,eAAe;gBAAE,OAAM;YAChC,MAAM,EAAC,IAAI,GAAG,IAAI,EAAE,IAAI,EAAC,GAAG,IAAI,CAAC,OAAO,CAAA;YACxC,SAAS,CAAC,iBAAiB,EAAE,EAAC,IAAI,EAAE,IAAI,EAAC,CAAC,CAAA;YAC1C,MAAM,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,CAAA;QAChC,CAAC,CAAA,CAAC,CAAA;QAEF,QAAQ,CAAC,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC,WAAW,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,CAAA;IACjE,CAAC;IAEQ,OAAO,CAAC,IAAY;QACzB,SAAS,CAAC,oBAAoB,EAAE,IAAI,CAAC,CAAA;QACrC,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,MAAM,IAAI,KAAK,CAAC,mCAAmC,CAAC,CAAA;QACxE,uCAAiB,CAAC,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IACjF,CAAC;CACJ;AAzBD,0CAyBC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@taro-hmr-compile/plugin-webpack",
-  "version": "0.0.1-alpha.5",
+  "version": "0.0.1-alpha.7",
   "description": "",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -19,9 +19,10 @@
   },
   "type": "commonjs",
   "peerDependencies": {
-    "@tarojs/helper": "^3.0.0",
-    "@tarojs/service": "^3.0.0",
-    "@tarojs/taro": "^3.0.0",
+    "@tarojs/components": ">=3.0.0",
+    "@tarojs/helper": ">=3.0.0",
+    "@tarojs/service": ">=3.0.0",
+    "@tarojs/taro": ">=3.0.0",
     "webpack": "^5.0.0"
   },
   "devDependencies": {
@@ -32,6 +33,7 @@
     "@types/babel__generator": "^7.27.0",
     "@types/babel__template": "^7.4.4",
     "@types/babel__traverse": "^7.28.0",
+    "@types/debug": "^4.1.13",
     "@types/node": "^22.20.1",
     "typescript": "^5.8.2",
     "webpack": "^5.110.3"
@@ -42,8 +44,8 @@
     "@babel/template": "^7.29.7",
     "@babel/traverse": "^7.29.8",
     "@babel/types": "^7.29.8",
-    "@taro-hmr-compile/core": "0.0.1-alpha.5",
-    "@taro-hmr-compile/react-refresh": "0.0.1-alpha.5",
+    "@taro-hmr-compile/core": "0.0.1-alpha.7",
+    "debug": "^4.4.3",
     "tapable": "^2.3.3",
     "webpack-sources": "^3.5.1"
   },

package/src/compile/hmr-compiler-loader.ts

@@ -0,0 +1,141 @@
+import generator from '@babel/generator'
+import * as parser from '@babel/parser'
+import template from '@babel/template'
+import traverse, {NodePath} from '@babel/traverse'
+import * as t from '@babel/types'
+import type {LoaderDefinitionFunction} from 'webpack'
+import webpack from 'webpack'
+
+const CREATE_PAGE_CONFIG = 'createPageConfig'
+
+const WITH_HMR_PAGE_CONFIG = 'withHmrPageConfig'
+
+const TARO_RUNTIME_REQUEST = '@tarojs/runtime'
+
+const LOG_REQUEST = require.resolve('../log')
+
+const CORE_RUNTIME_REQUEST = require.resolve('@taro-hmr-compile/core/runtime')
+
+export const injectAppHmrRuntime = (source: string, debugNamespaces = '') => {
+
+
+    const ast = parser.parse(source, {sourceType: 'module'})
+
+    const buildHmrCode = template.statements(`
+      import { hmrState, mergePatches, enableLog as enableHmrCoreLog } from ${JSON.stringify(CORE_RUNTIME_REQUEST)}
+      import { log, enableLog as enableHmrWebpackLog } from ${JSON.stringify(LOG_REQUEST)}
+      enableHmrCoreLog(${JSON.stringify(debugNamespaces)})
+      enableHmrWebpackLog(${JSON.stringify(debugNamespaces)})
+      globalThis.log = log.extend('runtime')
+      globalThis.miniHmrApplyPatch = async (patches)=>{
+        try {
+          const { miniHmr } = __webpack_require__
+          const bootstrapPatch = patches.find(patch => patch.type === 'bootstrap')
+
+          if (miniHmr.shouldApplyBootstrapPatch(bootstrapPatch)) miniHmr.applyBootstrapPatch(bootstrapPatch)
+
+          const updatePatch = mergePatches(${webpack.RuntimeGlobals.getFullHash}(), patches)
+          hmrState.setLastFullHash(updatePatch?.toHash ?? ${webpack.RuntimeGlobals.getFullHash}())
+          await miniHmr.applyUpdatePatch(updatePatch)
+        } catch (error) {
+          console.error('[taro-hmr-compile] patch apply failed', error)
+          return Promise.resolve()
+        }
+      };
+    `, {placeholderPattern: false})
+
+    traverse(ast, {
+        Program(path) {
+            const body = path.get('body')
+            const hasInjected = body.some(item => item.isImportDeclaration() && t.isStringLiteral(item.node.source, {value: CORE_RUNTIME_REQUEST}))
+            if (hasInjected) return
+
+            const nodes = buildHmrCode()
+            const lastImport = [...body].reverse().find(item => item.isImportDeclaration())
+
+            if (lastImport) lastImport.insertAfter(nodes)
+            if (!lastImport) path.unshiftContainer('body', nodes)
+        },
+    })
+
+    return generator(ast).code
+}
+
+export const transformPageConfig = (source: string, sourceFileName?: string) => {
+
+    const ast = parser.parse(source, {sourceType: 'module', plugins: ['typescript', 'jsx']})
+
+    const hasImportWithHmrPageConfig = (programPath: NodePath<t.Program>) => {
+        return programPath.node.body.some(node => {
+            if (!t.isImportDeclaration(node)) return false
+            if (!t.isStringLiteral(node.source, {value: CORE_RUNTIME_REQUEST})) return false
+            return node.specifiers.some(specifier => {
+                return t.isImportSpecifier(specifier) && t.isIdentifier(specifier.imported, {name: WITH_HMR_PAGE_CONFIG})
+            })
+        })
+    }
+
+    traverse(ast, {
+        Program(programPath) {
+
+            // 判断是否存在 createPageConfig 引用
+            const createPageConfigBinding = programPath.scope.getBinding(CREATE_PAGE_CONFIG)
+            if (!createPageConfigBinding || !createPageConfigBinding.path.isImportSpecifier()) return
+
+            // 判断 createPageConfig 引用是否来自 @tarojs/runtime
+            const {parentPath: createPageConfigImportDeclaration} = createPageConfigBinding.path
+            if (!t.isImportDeclaration(createPageConfigImportDeclaration.node)) return
+            if (!t.isStringLiteral(createPageConfigImportDeclaration.node.source, {value: TARO_RUNTIME_REQUEST})) return
+
+            // 判断是否已经注入了 withHmrPageConfig
+            if (hasImportWithHmrPageConfig(programPath)) return
+
+            // 判断是否存在 withHmrPageConfig 引用
+            const hasWithHmrPageConfigBinding = programPath.scope.hasBinding(WITH_HMR_PAGE_CONFIG)
+
+            // 生成 withHmrPageConfig 的别名
+            const wrapperIdentifier = hasWithHmrPageConfigBinding ? programPath.scope.generateUidIdentifier(WITH_HMR_PAGE_CONFIG) : t.identifier(WITH_HMR_PAGE_CONFIG)
+
+            // 生成 runtime import
+            const runtimeImport = (() => {
+                if (!hasWithHmrPageConfigBinding) return template.statement(`import { ${WITH_HMR_PAGE_CONFIG} } from ${JSON.stringify(CORE_RUNTIME_REQUEST)};`)()
+                return template.statement(`import { ${WITH_HMR_PAGE_CONFIG} as %%WRAPPER%% } from ${JSON.stringify(CORE_RUNTIME_REQUEST)};`)({WRAPPER: wrapperIdentifier})
+            })()
+
+            programPath.traverse({
+                CallExpression(CallExpressionPath) {
+                    const {node: CallExpressionNode} = CallExpressionPath
+                    if (!t.isIdentifier(CallExpressionNode.callee, {name: CREATE_PAGE_CONFIG})) return
+                    const [_, pageName] = CallExpressionNode.arguments
+                    const wrappedPageConfig = template.expression(`%%WRAPPER%%(%%PAGE_CONFIG%%, %%PAGE_NAME%%)`)({
+                        WRAPPER: wrapperIdentifier,
+                        PAGE_CONFIG: CallExpressionNode,
+                        PAGE_NAME: pageName,
+                    })
+
+                    if (!hasImportWithHmrPageConfig(programPath)) programPath.unshiftContainer('body', runtimeImport)
+
+                    CallExpressionPath.replaceWith(wrappedPageConfig)
+                    CallExpressionPath.skip()
+                }
+            })
+
+        },
+    })
+
+    return generator(ast, {sourceMaps: true, sourceFileName}, source).code
+}
+
+interface LoaderOptions {
+    miniType: 'PAGE' | 'ENTRY'
+    debugNamespaces?: string
+}
+
+const hmrCompilerLoader: LoaderDefinitionFunction<LoaderOptions> = function (source) {
+    const {miniType, debugNamespaces} = this.getOptions()
+    if (miniType === 'ENTRY') return injectAppHmrRuntime(source, debugNamespaces)
+    if (miniType === 'PAGE') return transformPageConfig(source, this.resourcePath) ?? source
+    return source
+}
+
+export default hmrCompilerLoader

package/src/compile/hmr-compiler-plugin.ts

@@ -9,15 +9,24 @@ import type {Source} from 'webpack-sources'
 import {HMR_PATCH_ASSET} from '../constants'
 import {clearCompiledPages, isPageCompiled, markPageCompiled} from './compile-state'
 import {getAllPages} from '../utils'
+import {log} from "../log";
+
+const compilerLog = log.extend('HmrCompilerPlugin')
 
 const PLUGIN_NAME = 'HmrCompilerPlugin'
 
+interface TaroNormalModule {
+    miniType?: string
+    loaders: Array<{ loader: string; options?: unknown }>
+}
+
 type StyleFilename = NonNullable<Compiler['options']['output']['cssFilename']>
 
 export interface HmrCompilerPluginOptions {
     paths: IPaths
     appConfig: AppConfig
     styleFilename?: StyleFilename
+    debugNamespaces?: string
 }
 
 export interface HmrCompilerHooks {
@@ -51,7 +60,11 @@ export class HmrCompilerPlugin {
     // 当前编译批次的文件快照。与 pendingFiles 分离，确保编译期间新到达的请求留给下一批处理。
     private readonly rebuildingFiles = new Set<string>()
 
-    constructor(private readonly options: HmrCompilerPluginOptions) {}
+    private readonly options: HmrCompilerPluginOptions
+
+    constructor(options: HmrCompilerPluginOptions) {
+        this.options = options
+    }
 
     static getCompilerHooks(compiler: Compiler): HmrCompilerHooks {
         let hooks = HmrCompilerPlugin.compilerHooksMap.get(compiler)
@@ -95,6 +108,26 @@ export class HmrCompilerPlugin {
             const hmrHooks = HmrCompilerPlugin.getCompilationHooks(compilation)
             const javascriptHooks = compiler.webpack.javascript.JavascriptModulesPlugin.getCompilationHooks(compilation)
 
+            const HMR_COMPILER_LOADER = require.resolve('./hmr-compiler-loader')
+
+            const TARO_LOADER = '@tarojs/taro-loader'
+
+            // 尽量晚执行
+            compiler.webpack.NormalModule.getCompilationHooks(compilation).loader.tap({name: PLUGIN_NAME, stage: 10_000}, (_loaderContext, normalModule: TaroNormalModule) => {
+                    if (!normalModule.miniType) return
+
+                    if (normalModule.loaders.some(item => item.loader === HMR_COMPILER_LOADER)) return
+
+                    const taroLoaderIndex = normalModule.loaders.findIndex(item => item.loader.replace(/\\/g, '/').includes(TARO_LOADER))
+
+                    if (taroLoaderIndex < 0) return
+
+                    const loaderOptions = {miniType: normalModule.miniType, debugNamespaces: this.options.debugNamespaces}
+                    // Loader 从右向左执行；插到 taro-loader 左侧才能处理它生成的入口注册代码。
+                    normalModule.loaders.splice(taroLoaderIndex, 0, { loader: HMR_COMPILER_LOADER, options: loaderOptions})
+                },
+            )
+
             // 只修改 Page Chunk 的 JS transport。Webpack 的 ModuleGraph / ChunkGraph 保持不变，
             // 因而 hash、HMR diff 和 hot-update 仍以完整模块图为准。
             javascriptHooks.renderChunk.tap({name: PLUGIN_NAME, stage: -10_000}, (source, {chunk}) => {
@@ -155,6 +188,7 @@ export class HmrCompilerPlugin {
         try {
             if (isPageCompiled(this.options.paths.appPath, page)) return
             // loader 在下一轮构建中读取该状态；必须先标记，再触发 watch invalidation。
+            compilerLog('start compile %s', page)
             markPageCompiled(this.options.paths.appPath, page)
             this.pendingFiles.add(resolveMainFilePath(path.resolve(this.options.paths.sourcePath, page)))
             this.compiler?.watching?.invalidate()

package/src/compile/lazy-compiler-loader.ts

@@ -0,0 +1,51 @@
+import type {LoaderDefinitionFunction} from 'webpack'
+import path from "path";
+import {getAllPages} from '../utils'
+import {isPageCompiled} from './compile-state'
+import type {AppConfig} from "@tarojs/taro";
+
+
+interface CreateShellOpt {
+    page: string
+    framework: 'react'
+    compileUrl: string
+}
+
+export const createReactShell = (opt: CreateShellOpt) => {
+    const {page, compileUrl} = opt
+    return `
+    import { PageShell } from ${JSON.stringify(require.resolve('@taro-hmr-compile/core/runtime'))}
+    const Page = () => <PageShell page={${JSON.stringify(page)}} compileUrl={${JSON.stringify(compileUrl)}}/>
+    export default Page
+    `
+}
+
+const createShell = (opt: CreateShellOpt) => {
+    if (opt.framework === 'react') return createReactShell(opt)
+    throw new Error(`unsupported framework: ${opt.framework}`)
+}
+
+
+interface LoaderOptions {
+    appPath: string
+    sourcePath: string
+    appConfig: AppConfig
+    framework: 'react'
+    compileUrl: string
+}
+
+const lazyCompilerLoader: LoaderDefinitionFunction<LoaderOptions> = function (source) {
+    const {appPath, framework, appConfig, sourcePath, compileUrl} = this.getOptions()
+
+    const {dir: resourceDir, name: resourceName} = path.parse(path.relative(sourcePath, this.resourcePath))
+
+    const resourcePath = path.join(resourceDir, resourceName)
+
+    const isPageEntry = getAllPages(appConfig).includes(resourcePath)
+
+    if (!isPageEntry || isPageCompiled(appPath, resourcePath)) return source
+
+    return createShell({page: resourcePath, framework, compileUrl})
+}
+
+export default lazyCompilerLoader

package/src/constants.ts

@@ -3,3 +3,5 @@ export const HMR_OUTPUT_PATH = 'hmr'
 export const HMR_PATCH_ASSET = `${HMR_OUTPUT_PATH}/patch.js`
 
 export const DEFAULT_HMR_PATCH_HISTORY_LIMIT = 20
+
+export const DEFAULT_DEBUG_NAMESPACES = 'taro-hmr-compile:*'

package/src/index.ts

@@ -1,17 +1,19 @@
 import type {IPluginContext} from '@tarojs/service'
 import type {AppConfig} from '@tarojs/taro'
-import {HMR_OUTPUT_PATH} from './constants'
+import {HMR_OUTPUT_PATH, DEFAULT_DEBUG_NAMESPACES} from './constants'
 import {getAppConfig} from './utils'
 import {HmrCompilerPlugin} from './compile/hmr-compiler-plugin'
 import {HmrPatchPlugin} from './patch/hmr-patch-plugin'
 import {HmrServerPlugin} from './server/hmr-server-plugin'
-import {setupReactRefresh} from '@taro-hmr-compile/react-refresh/compiler'
-import {emptyDirFile} from '@taro-hmr-compile/core/compiler'
+import {emptyDirFile, findAvailablePort} from '@taro-hmr-compile/core/compiler'
+import {enableLog} from './log'
+
 
 export interface WebpackHmrCompileOpt {
     host: string
     port: number
     patchHistoryLimit: number
+    debug: boolean | string
 }
 
 export default (ctx: IPluginContext, pluginOpts: Partial<WebpackHmrCompileOpt>) => {
@@ -24,27 +26,37 @@ export default (ctx: IPluginContext, pluginOpts: Partial<WebpackHmrCompileOpt>)
     const appConfig: AppConfig = getAppConfig(ctx)
 
     const host = pluginOpts.host ?? '127.0.0.1'
-    const port = pluginOpts.port ?? 8080
-    const compileUrl = `http://${host}:${port}/compile`
 
-    setupReactRefresh(ctx)
+    const preferredPort = pluginOpts.port ?? 8080
+
+    const debugNamespaces = (() => {
+        if (typeof pluginOpts.debug === 'string') return pluginOpts.debug
+        return pluginOpts.debug ? DEFAULT_DEBUG_NAMESPACES : undefined
+    })()
+
+    if (debugNamespaces) enableLog(debugNamespaces)
 
     ctx.onBuildStart(() => emptyDirFile(outputPath))
 
-    ctx.modifyRunnerOpts(({ opts }) => {
+    ctx.modifyRunnerOpts(({opts}) => {
         opts.output ??= {}
         opts.output.clean = false
     })
 
-    ctx.modifyWebpackChain(({chain, webpack}) => {
+    ctx.modifyWebpackChain(async ({chain, webpack}) => {
+        const port = await findAvailablePort(preferredPort, host)
+
+        const compileUrl = `http://${host}:${port}/compile`
+
+        if (port !== preferredPort) console.warn(`[taro-hmr-compile] 端口 ${preferredPort} 已被占用，自动使用端口 ${port}`)
 
         chain.module
-            .rule('hmr-compile')
+            .rule('lazy-compiler')
             .test(/\.[jt]sx?$/)
             .include.add(ctx.paths.sourcePath)
             .end()
-            .use('hmr-compile-loader')
-            .loader(require.resolve('./compile/hmr-compile-loader'))
+            .use('lazy-compiler-loader')
+            .loader(require.resolve('./compile/lazy-compiler-loader'))
             .options({appPath, sourcePath, appConfig, framework, compileUrl})
             .end()
 
@@ -56,7 +68,7 @@ export default (ctx: IPluginContext, pluginOpts: Partial<WebpackHmrCompileOpt>)
 
         const [{filename: styleFilename}] = chain.plugin('miniCssExtractPlugin')?.get('args') || []
 
-        chain.plugin('hmr-compiler-plugin').use(HmrCompilerPlugin, [{paths: ctx.paths, appConfig, styleFilename}])
+        chain.plugin('hmr-compiler-plugin').use(HmrCompilerPlugin, [{paths: ctx.paths, appConfig, styleFilename, debugNamespaces}])
 
         chain.plugin('hmr-plugin').use(webpack.HotModuleReplacementPlugin)
 

package/src/log.ts

@@ -0,0 +1,5 @@
+import createDebug from 'debug'
+
+export const log = createDebug('taro-hmr-compile:webpack')
+
+export const enableLog = (namespaces: string) => createDebug.enable(namespaces)

package/src/patch/hmr-patch-plugin.ts

@@ -7,8 +7,8 @@ import type {Compilation, Compiler} from 'webpack'
 import {RawSource} from 'webpack-sources'
 import {DEFAULT_HMR_PATCH_HISTORY_LIMIT, HMR_PATCH_ASSET} from '../constants'
 import {HmrCompilerPlugin} from '../compile/hmr-compiler-plugin'
-import {HmrPatchManager} from '../patch/hmr-patch-manager'
-import type {PatchSource, UpdatePatchSource} from '../patch/hmr-patch-manager'
+import {HmrPatchManager} from './hmr-patch-manager'
+import type {PatchSource, UpdatePatchSource} from './hmr-patch-manager'
 import {HmrPatchRuntimePlugin} from './hmr-patch-runtime-plugin'
 
 const PLUGIN_NAME = 'HmrPatchPlugin'