Match-id-651cdb443b55c0b68ae538105437313e68020693

.eslintrc.js

@@ -32,6 +32,9 @@ module.exports = {
     es6: true,
   },
   rules: {
+    '@typescript-eslint/no-explicit-any': 'off',
+    '@typescript-eslint/no-non-null-assertion': 'off',
+    'semi': ["error", "always"],
     'accessor-pairs': 'off',
     'brace-style': ['error', '1tbs'],
     'func-style': ['warn', 'declaration', { allowArrowFunctions: true }],

libs/horizon/src/renderer/hooks/BaseHook.ts

@@ -1,7 +1,7 @@
 import type { VNode } from '../Types';
 import type { Hook } from './HookType';
 
-let processingVNode: VNode = null;
+let processingVNode: VNode | null = null;
 
 // lastTimeHook是上一次执行func时产生的hooks中，与currentHook对应的hook
 let lastTimeHook: Hook<any, any> | null = null;
@@ -13,7 +13,7 @@ export function getProcessingVNode() {
   return processingVNode;
 }
 
-export function setProcessingVNode(vNode: VNode) {
+export function setProcessingVNode(vNode: VNode | null) {
   processingVNode = vNode;
 }
 
@@ -21,11 +21,11 @@ export function getLastTimeHook() {
   return lastTimeHook;
 }
 
-export function setLastTimeHook(hook: Hook<any, any>) {
+export function setLastTimeHook(hook: Hook<any, any> | null) {
   lastTimeHook = hook;
 }
 
-export function setCurrentHook(hook: Hook<any, any>) {
+export function setCurrentHook(hook: Hook<any, any> | null) {
   currentHook = hook;
 }
 

libs/horizon/src/renderer/hooks/HookMain.ts

@@ -15,17 +15,17 @@ import {
   setProcessingVNode,
   setCurrentHook, getNextHook
 } from './BaseHook';
-import {useStateImpl,} from './UseStateHook';
-import {useReducerImpl,} from './UseReducerHook';
+import {useStateImpl} from './UseStateHook';
+import {useReducerImpl} from './UseReducerHook';
 import {HookStage, setHookStage} from './HookStage';
 
 // hook对外入口
-export function exeFunctionHook(
-  funcComp: (props: Object, arg: Object) => any,
-  props: Object,
-  arg: Object,
+export function exeFunctionHook<Props extends Record<string, any>, Arg>(
+  funcComp: (props: Props, arg: Arg) => any,
+  props: Props,
+  arg: Arg,
   processing: VNode,
-): any {
+) {
   // 重置全局变量
   resetGlobalVariable();
 
@@ -39,13 +39,13 @@ export function exeFunctionHook(
   processing.effectList = [];
 
   // 设置hook阶段
-  if (processing.isCreated || !processing.oldHooks.length) {
+  if (processing.isCreated || !processing.oldHooks!.length) {
     setHookStage(HookStage.Init);
   } else {
     setHookStage(HookStage.Update);
   }
 
-  let comp = funcComp(props, arg);
+  const comp = funcComp(props, arg);
 
   // 设置hook阶段为null，用于判断hook是否在函数组件中调用
   setHookStage(null);

libs/horizon/src/renderer/hooks/HookStage.ts

@@ -10,6 +10,6 @@ export function getHookStage() {
   return hookStage;
 }
 
-export function setHookStage(phase: HookStage) {
+export function setHookStage(phase: HookStage | null) {
   hookStage = phase;
 }

libs/horizon/src/renderer/render/ClsOrFunComponent.ts

@@ -1,36 +0,0 @@
-import type {VNode} from '../Types';
-
-import {FunctionComponent} from '../vnode/VNodeTags';
-import {resetDepContexts} from '../components/context/Context';
-import {getOldContext} from '../components/context/CompatibleContext';
-import {FlagUtils} from '../vnode/VNodeFlags';
-import {exeFunctionHook} from '../hooks/HookMain';
-import { createChildrenByDiff } from '../diff/nodeDiffComparator';
-
-function captureIndeterminateComponent(
-  processing: VNode,
-): VNode | null {
-  const funcComp = processing.type;
-
-  if (!processing.isCreated) {
-    processing.isCreated = true;
-    FlagUtils.markAddition(processing);
-  }
-
-  const props = processing.props;
-  const context = getOldContext(processing, funcComp, false);
-
-  resetDepContexts(processing);
-
-  const newElements = exeFunctionHook(funcComp, props, context, processing);
-
-  processing.tag = FunctionComponent;
-  processing.child = createChildrenByDiff(processing, processing.child, newElements, !processing.isCreated);
-  return processing.child;
-}
-
-export function captureRender(processing: VNode): VNode | null {
-  return captureIndeterminateComponent(processing);
-}
-
-export function bubbleRender() {}

libs/horizon/src/renderer/render/index.ts

@@ -10,7 +10,6 @@ import * as DomPortalRender from './DomPortal';
 import * as TreeRootRender from './TreeRoot';
 import * as DomTextRender from './DomText';
 import * as IncompleteClassComponentRender from './IncompleteClassComponent';
-import * as ClsOrFunComponentRender from './ClsOrFunComponent';
 import * as LazyComponentRender from './LazyComponent';
 import * as MemoComponentRender from './MemoComponent';
 import * as SuspenseComponentRender from './SuspenseComponent';
@@ -27,7 +26,6 @@ import {
   TreeRoot,
   DomText,
   IncompleteClassComponent,
-  ClsOrFunComponent,
   LazyComponent,
   MemoComponent,
   SuspenseComponent,
@@ -49,7 +47,6 @@ export default {
   [TreeRoot]: TreeRootRender,
   [DomText]: DomTextRender,
   [IncompleteClassComponent]: IncompleteClassComponentRender,
-  [ClsOrFunComponent]: ClsOrFunComponentRender,
   [LazyComponent]: LazyComponentRender,
   [MemoComponent]: MemoComponentRender,
   [SuspenseComponent]: SuspenseComponentRender,

libs/horizon/src/renderer/vnode/VNode.ts

@@ -1,7 +1,7 @@
 /**
  * 虚拟DOM结构体
  */
-import { TreeRoot, FunctionComponent, ClassComponent, DomPortal, DomText, ContextConsumer, ForwardRef, SuspenseComponent, LazyComponent, ClsOrFunComponent, DomComponent, Fragment, ContextProvider, Profiler, MemoComponent, IncompleteClassComponent } from './VNodeTags';
+import { TreeRoot, FunctionComponent, ClassComponent, DomPortal, DomText, ContextConsumer, ForwardRef, SuspenseComponent, LazyComponent, DomComponent, Fragment, ContextProvider, Profiler, MemoComponent, IncompleteClassComponent } from './VNodeTags';
 import type { VNodeTag } from './VNodeTags';
 import type { RefType, ContextType } from '../Types';
 import type { Hook } from '../hooks/HookType';
@@ -18,8 +18,8 @@ export class VNode {
   parent: VNode | null = null; // 父节点
   child: VNode | null = null; // 子节点
   next: VNode | null = null; // 兄弟节点
-  cIndex: number = 0; // 节点在children数组中的位置
-  eIndex: number = 0; // HorizonElement在jsx中的位置，例如：jsx中的null不会生成vNode，所以eIndex和cIndex不一致
+  cIndex = 0; // 节点在children数组中的位置
+  eIndex = 0; // HorizonElement在jsx中的位置，例如：jsx中的null不会生成vNode，所以eIndex和cIndex不一致
 
   ref: RefType | ((handle: any) => void) | null = null; // 包裹一个函数，submit阶段使用，比如将外部useRef生成的对象赋值到ref上
   oldProps: any = null;
@@ -33,12 +33,12 @@ export class VNode {
 
   state: any; // ClassComponent和TreeRoot的状态
   hooks: Array<Hook<any, any>> | null; // 保存hook
-  suspenseChildStatus: string = ''; // Suspense的Children是否显示
+  suspenseChildStatus = ''; // Suspense的Children是否显示
   depContexts: Array<ContextType<any>> | null; // FunctionComponent和ClassComponent对context的依赖列表
   isDepContextChange: boolean; // context是否变更
   dirtyNodes: Array<VNode> | null = null; // 需要改动的节点数组
-  shouldUpdate: boolean = false;
-  childShouldUpdate: boolean = false;
+  shouldUpdate = false;
+  childShouldUpdate = false;
   task: any;
 
   // 使用这个变量来记录修改前的值，用于恢复。
@@ -51,7 +51,7 @@ export class VNode {
   flags = InitFlag;
   clearChild: VNode | null;
   // one tree相关属性
-  isCreated: boolean = true;
+  isCreated = true;
   oldHooks: Array<Hook<any, any>> | null; // 保存上一次执行的hook
   oldState: any;
   oldRef: RefType | ((handle: any) => void) | null = null;
@@ -61,7 +61,7 @@ export class VNode {
   suspenseDidCapture: boolean; // suspense是否捕获了异常
   promiseResolve: boolean; // suspense的promise是否resolve
 
-  path: string = ''; // 保存从根到本节点的路径
+  path = ''; // 保存从根到本节点的路径
   toUpdateNodes: Set<VNode> | null; // 保存要更新的节点
 
   belongClassVNode: VNode | null = null; // 记录JSXElement所属class vNode，处理ref的时候使用
@@ -84,6 +84,7 @@ export class VNode {
         this.contexts = null;
         break;
       case FunctionComponent:
+        this.realNode = null;
         this.effectList = null;
         this.hooks = null;
         this.depContexts = null;
@@ -101,10 +102,6 @@ export class VNode {
         this.oldState = null;
         this.contexts = null;
         break;
-      case ClsOrFunComponent:
-        this.realNode = null;
-        this.contexts = null;
-        break;
       case DomPortal:
         this.realNode = null;
         this.contexts = null;

libs/horizon/src/renderer/vnode/VNodeCreator.ts

@@ -11,7 +11,6 @@ import {
   DomPortal,
   TreeRoot,
   DomText,
-  ClsOrFunComponent,
   LazyComponent,
   MemoComponent,
   SuspenseComponent,
@@ -52,13 +51,12 @@ function isClassComponent(comp: Function) {
 
 // 解析懒组件的tag
 export function getLazyVNodeTag(lazyComp: any): string {
-  let vNodeTag = ClsOrFunComponent;
   if (typeof lazyComp === 'function') {
-    vNodeTag = isClassComponent(lazyComp) ? ClassComponent : FunctionComponent;
+    return isClassComponent(lazyComp) ? ClassComponent : FunctionComponent;
   } else if (lazyComp !== undefined && lazyComp !== null && typeLazyMap[lazyComp.vtype]) {
-    vNodeTag = typeLazyMap[lazyComp.vtype];
+    return typeLazyMap[lazyComp.vtype];
   }
-  return vNodeTag;
+  throw Error("Horizon can't resolve the content of lazy ");
 }
 
 // 创建processing
@@ -105,7 +103,7 @@ export function createPortalVNode(portal) {
 }
 
 export function createUndeterminedVNode(type, key, props) {
-  let vNodeTag = ClsOrFunComponent;
+  let vNodeTag = FunctionComponent;
   let isLazy = false;
   const componentType = typeof type;
 

libs/horizon/src/renderer/vnode/VNodeTags.ts

@@ -6,7 +6,6 @@ export type VNodeTag = string;
 export const TreeRoot = 'TreeRoot'; // tree的根节点，用于存放一些tree级的变量
 export const FunctionComponent = 'FunctionComponent';
 export const ClassComponent = 'ClassComponent';
-export const ClsOrFunComponent = 'ClsOrFunComponent';
 export const DomPortal = 'DomPortal';
 export const DomComponent = 'DomComponent';
 export const DomText = 'DomText';

package.json

@@ -4,6 +4,7 @@
     "libs/*"
   ],
   "scripts": {
+    "lint": "eslint . --ext .ts",
     "build": " webpack --config ./scripts/webpack/webpack.config.js",
     "build-3rdLib": "node ./scripts/gen3rdLib.js",
     "build-3rdLib-dev": "npm run build & node ./scripts/gen3rdLib.js --dev",