feat(runtime): 添加 h 函数和虚拟节点系统

- 实现了 h 函数用于创建虚拟节点
- 添加了 VNode 接口定义和创建逻辑
- 引入了 ShapeFlags 枚举来标记节点类型
- 实现了虚拟节点子元素标准化功能
- 在 runtime-core 中导出 h 函数
- 添加了 h 函数使用示例页面

packages/shared/src/index.ts

@@ -1,3 +1,4 @@
+export { ShapeFlags } from './shapeFlags'
 //判断是否为一个数组
 export const isArray = Array.isArray
 
@@ -14,6 +15,10 @@ export const isFunction = (val: unknown): val is Function => {
   return typeof val === 'function'
 }
 
+export const isString = (val: unknown): val is string => {
+  return typeof val === 'string'
+}
+
 export const extend = Object.assign
 
 export const EMPTY_OBJ: { readonly [key: string]: any } = {}

packages/shared/src/shapeFlags.ts

@@ -0,0 +1,30 @@
+export const enum ShapeFlags {
+  /**
+   * type=Element
+   */
+  ELEMENT = 1,
+  /**
+   * 函数组件
+   */
+  FUNCTIONAL_COMPONENT = 1 << 1,
+  /**
+   * 有状态(响应数据)组件
+   */
+  STATEFUL_COMPONENT = 1 << 2,
+  /**
+   * children=Text
+   */
+  TEXT_CHILDREN = 1 << 3,
+  /**
+   * children=Array
+   */
+  ARRAY_CHILDREN = 1 << 4,
+  /**
+   * children=slot
+   */
+  SLOTS__CHILDREN = 1 << 5,
+  /**
+   * 组件: 有状态(响应数据)组件 | 函数组件
+   */
+  COMPONENT = ShapeFlags.STATEFUL_COMPONENT | ShapeFlags.FUNCTIONAL_COMPONENT
+}