@taro-hmr-compile/plugin-webpack 0.0.1-alpha.3

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

@@ -0,0 +1,150 @@
+import {parse} from '@babel/parser'
+import generate from '@babel/generator'
+import webpack from 'webpack'
+
+const PLUGIN_NAME = 'HmrPatchRuntimePlugin'
+
+const hotRuntimeCode = `
+var applyQueue = Promise.resolve();
+var applySequence = 0;
+
+${webpack.RuntimeGlobals.require}.miniHmr = {
+  applyPatch: function(patch) {
+    if (!patch) return Promise.resolve();
+
+    var applyId = ++applySequence;
+    var enqueueHash = ${webpack.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.RuntimeGlobals.moduleFactories}, moduleId)) {
+          ${webpack.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 task = applyQueue.then(function() {
+      var runtimeHash = ${webpack.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;
+      }
+
+      currentUpdateApplyHandlers = [];
+
+      ${webpack.RuntimeGlobals.require}.miniHmr.preparePatch(
+        patch,
+        currentUpdateApplyHandlers
+      );
+
+      return setStatus('ready')
+        .then(function() {
+          return hotApply();
+        })
+        .then(function(updatedModules) {
+          ${webpack.RuntimeGlobals.getFullHash} = function() {
+            return patch.toHash;
+          };
+
+          console.log('[taro-hmr-compile] patch applied', {
+            applyId: applyId,
+            fromHash: patch.fromHash,
+            toHash: patch.toHash,
+            updatedModules: updatedModules
+          });
+
+          return updatedModules;
+        });
+    });
+
+    // 单次失败不能阻塞后续 patch
+    applyQueue = task.catch(function() {});
+
+    return task;
+  }
+};
+`;
+
+const chunkLoadingRuntimeCode = `
+${webpack.RuntimeGlobals.require}.miniHmr.preparePatch = function(patch, applyHandlers) {
+  currentUpdateChunks = {};
+  currentUpdate = Object.assign({}, patch.modules);
+  currentUpdateRemovedChunks = [];
+  currentUpdateRuntime = [];
+
+  if (patch.removedModules) {
+    patch.removedModules.forEach(function(moduleId) {
+      currentUpdate[moduleId] = false;
+    });
+  }
+
+  applyHandlers.push(applyHandler);
+};
+`
+
+const injectRuntime = (source: string, injectedCode: string) => {
+    const runtime = parse(source, {sourceType: 'script'})
+    const injected = parse(injectedCode, {sourceType: 'script'})
+
+    runtime.program.body.push(...injected.program.body)
+
+    return generate(runtime).code
+}
+
+export class HmrPatchRuntimePlugin {
+    apply(compiler: webpack.Compiler) {
+        compiler.hooks.thisCompilation.tap(
+            PLUGIN_NAME,
+            compilation => {
+                compilation.hooks.runtimeModule.tap(
+                    PLUGIN_NAME,
+                    runtimeModule => {
+                        const injectedCode = {
+                            HotModuleReplacementRuntimeModule: hotRuntimeCode,
+                            JsonpChunkLoadingRuntimeModule: chunkLoadingRuntimeCode,
+                        }[runtimeModule.constructor.name]
+
+                        if (!injectedCode) return
+
+                        const generate = runtimeModule.generate.bind(runtimeModule)
+
+                        runtimeModule.generate = () => {
+                            const source = generate()
+
+                            if (!source) return source
+
+                            return injectRuntime(source, injectedCode)
+                        }
+                    },
+                )
+            },
+        )
+    }
+}

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

@@ -0,0 +1,34 @@
+import {HmrCompileServer} from '@taro-hmr-compile/core/compiler'
+import type {Compiler} from 'webpack'
+import {HmrCompilerPlugin} from '../compile/hmr-compiler-plugin'
+
+const PLUGIN_NAME = 'HmrServerPlugin'
+
+export interface HmrServerPluginOptions {
+    host?: string
+    port?: number
+}
+
+export class HmrServerPlugin extends HmrCompileServer {
+    private compiler?: Compiler
+
+    constructor(private readonly options: HmrServerPluginOptions) {
+        super()
+    }
+
+    apply(compiler: Compiler) {
+        this.compiler = compiler
+
+        compiler.hooks.afterEmit.tap(PLUGIN_NAME, compilation => {
+            const isSuccessful = compilation.errors.length === 0 && Boolean(compilation.hash)
+            if (isSuccessful && !this.isServerRunning) this.start(this.options.port ?? 8080, this.options.host)
+        })
+
+        compiler.hooks.watchClose.tap(PLUGIN_NAME, () => this.stop())
+    }
+
+    override compile(page: string) {
+        if (!this.compiler) throw new Error('[taro-hmr-compile] Compiler 尚未初始化')
+        HmrCompilerPlugin.getCompilerHooks(this.compiler).compileRequested.call(page)
+    }
+}

package/src/utils.ts

@@ -0,0 +1,25 @@
+import {readConfig, resolveMainFilePath} from '@tarojs/helper'
+import type {IPluginContext} from '@tarojs/service'
+import type {AppConfig} from '@tarojs/taro'
+import path from 'path'
+
+export const getAppConfig = (ctx: IPluginContext): AppConfig => {
+    const sourceRoot = ctx.initialConfig.sourceRoot || 'src'
+    
+    const appConfigPath = resolveMainFilePath(path.resolve(ctx.paths.appPath, sourceRoot, 'app.config'))
+
+    return readConfig(appConfigPath, ctx.initialConfig)
+}
+
+export const getAllPages = (appConfig: AppConfig): string[] => {
+    const subPackages = [
+        ...(appConfig.subPackages ?? []),
+        ...(appConfig.subpackages ?? []),
+    ]
+
+    const subPackagePages = subPackages.flatMap(({root, pages}) =>
+        pages.map(page => `${root.replace(/\/+$/, '')}/${page.replace(/^\/+/, '')}`)
+    )
+
+    return [...(appConfig.pages ?? []), ...subPackagePages]
+}

package/tsconfig.json

@@ -0,0 +1,21 @@
+{
+  "compilerOptions": {
+    "target": "ES2015",
+    "module": "commonjs",
+    "strict": true,
+    "sourceMap": true,
+    "declaration": true,
+    "esModuleInterop": true,
+    "moduleResolution": "node",
+    // 声明文件生成到的文件目录
+    "outDir": "./dist/",
+    "skipLibCheck": true,
+    /* Skip type checking of declaration files. */
+    "forceConsistentCasingInFileNames": true,
+    "jsx": "react",
+    "lib": ["esnext", "dom"],
+    "types": ["@types/node"],
+  },
+  "include": ["src"],
+
+}