feat: onbeforehydrate

[HomyeeKing]

背景

线上hydrate由于报错栈没有参考价值，不能快速修复，在 appConfig 添加 onBeforeHydrate hook 来让开发者获取 hydrate 前后的 DOM 然后上报，用于快速定位问题

使用

// src/app.ts
import { defineAppConfig } from 'ice';

// App config, see https://ice3.alibaba-inc.com/v3/docs/guide/basic/app
export default defineAppConfig(() => {
  let beforeHydrateHtml = '';
  return {
    // Set your configs here.
    app: {
      onRecoverableError(error: any, errorInfo) {

+        // 上报 监控平台
+        if(reportLog){ 
+ 				const currentHtml = document.documentElement.innerHTML
+         reportLog({
+            code: `hydrate 错误 DOM Diff`,
+            message: {
+              beforeHydrateHtml,
+              currentHtml
+            },
+            level: 'Debug',
+          });
+        }
+      },
+      onBeforeHydrate() {
+        beforeHydrateHtml = document.documentElement.innerHTML;
+        console.log('beforeHydrate', document.documentElement.innerHTML);
+      },
+    },
  };
});

效果

获取前后的 DOM 然后 diff 查看差异点