Merge branch 'refactor/lihao-code-style' into 'refactor/code-style'

Code review title: refactor(style): fix code style for designer
Code review description: refactor(style): fix code style for editor-core

refactor(style): fix code style for editor-skeleton

refactor(style): fix code style for react-simulator-renderer

refactor(style): fix code style for rax-simulator-renderer
Code review Link: https://code.aone.alibaba-inc.com/ali-lowcode/ali-lowcode-engine/codereview/3709472

packages/designer/.eslintrc.js

@@ -0,0 +1,16 @@
+module.exports = {
+  extends: 'eslint-config-ali/typescript/react',
+  rules: {
+    'react/no-multi-comp': 1,
+    'no-unused-expressions': 1,
+    'implicit-arrow-linebreak': 1,
+    'no-nested-ternary': 1,
+    'no-mixed-operators': 1,
+    '@typescript-eslint/no-parameter-properties': 1,
+    '@typescript-eslint/ban-types': 1,
+    'no-shadow': 1,
+    'no-prototype-builtins': 1,
+    'no-useless-constructor': 1,
+    'no-empty-function': 1,
+  }
+}

packages/designer/src/builtin-simulator/bem-tools/border-detecting.tsx

@@ -38,6 +38,7 @@ export class BorderDetectingInstance extends PureComponent<{
 }
 
 @observer
+// eslint-disable-next-line react/no-multi-comp
 export class BorderDetecting extends Component<{ host: BuiltinSimulatorHost }> {
   shouldComponentUpdate() {
     return false;

packages/designer/src/builtin-simulator/bem-tools/border-resizing.tsx

@@ -57,6 +57,7 @@ export default class BoxResizing extends Component<{ host: BuiltinSimulatorHost
 }
 
 @observer
+// eslint-disable-next-line react/no-multi-comp
 export class BoxResizingForNode extends Component<{ host: BuiltinSimulatorHost; node: Node }> {
   static contextType = SimulatorContext;
 
@@ -104,6 +105,7 @@ export class BoxResizingForNode extends Component<{ host: BuiltinSimulatorHost;
 }
 
 @observer
+// eslint-disable-next-line react/no-multi-comp
 export class BoxResizingInstance extends Component<{
   observed: OffsetObserver;
   highlight?: boolean;

packages/designer/src/builtin-simulator/bem-tools/border-selecting.tsx

@@ -55,6 +55,7 @@ export class BorderSelectingInstance extends Component<{
 }
 
 @observer
+// eslint-disable-next-line react/no-multi-comp
 class Toolbar extends Component<{ observed: OffsetObserver }> {
   shouldComponentUpdate() {
     return false;
@@ -150,6 +151,7 @@ function createAction(content: ReactNode | ComponentType<any> | ActionContentObj
 }
 
 @observer
+// eslint-disable-next-line react/no-multi-comp
 export class BorderSelectingForNode extends Component<{ host: BuiltinSimulatorHost; node: Node }> {
   get host(): BuiltinSimulatorHost {
     return this.props.host;
@@ -193,6 +195,7 @@ export class BorderSelectingForNode extends Component<{ host: BuiltinSimulatorHo
 }
 
 @observer
+// eslint-disable-next-line react/no-multi-comp
 export class BorderSelecting extends Component<{ host: BuiltinSimulatorHost }> {
   get host(): BuiltinSimulatorHost {
     return this.props.host;

packages/designer/src/builtin-simulator/bem-tools/drag-resize-engine.ts

@@ -1,7 +1,7 @@
 import { EventEmitter } from 'events';
-import { ISimulatorHost, isSimulatorHost } from '../../simulator';
+import { ISimulatorHost } from '../../simulator';
 import { Designer, Point } from '../../designer';
-import { setNativeSelection, cursor } from '@ali/lowcode-utils';
+import { cursor } from '@ali/lowcode-utils';
 // import Cursor from './cursor';
 // import Pages from './pages';
 
@@ -19,7 +19,7 @@ function makeEventsHandler(
   // }
   docs.add(sourceDoc);
   // if (sourceDoc !== topDoc || isDragEvent(boostEvent)) {
-  sensors.forEach((sim) => {
+  sensors.forEach(sim => {
     const sdoc = sim.contentDocument;
     if (sdoc) {
       docs.add(sdoc);
@@ -28,7 +28,7 @@ function makeEventsHandler(
   // }
 
   return (handle: (sdoc: Document) => void) => {
-    docs.forEach((doc) => handle(doc));
+    docs.forEach(doc => handle(doc));
   };
 }
 
@@ -38,23 +38,11 @@ export default class DragResizeEngine {
 
   private dragResizing = false;
 
-  constructor(readonly designer: Designer) {
+  constructor(designer: Designer) {
     this.designer = designer;
     this.emitter = new EventEmitter();
   }
 
-  private getMasterSensors(): ISimulatorHost[] {
-    return this.designer.project.documents
-      .map((doc) => {
-        // TODO: not use actived,
-        if (doc.actived && doc.simulator?.sensorAvailable) {
-          return doc.simulator;
-        }
-        return null;
-      })
-      .filter(Boolean) as any;
-  }
-
   isDragResizing() {
     return this.dragResizing;
   }
@@ -84,14 +72,12 @@ export default class DragResizeEngine {
     const masterSensors = this.getMasterSensors();
 
     const createResizeEvent = (e: MouseEvent | DragEvent): Point => {
-      const evt: any = {};
-
       const sourceDocument = e.view?.document;
 
       if (!sourceDocument || sourceDocument === document) {
         return e;
       }
-      const srcSim = masterSensors.find((sim) => sim.contentDocument === sourceDocument);
+      const srcSim = masterSensors.find(sim => sim.contentDocument === sourceDocument);
       if (srcSim) {
         return srcSim.viewport.toGlobalPoint(e);
       }
@@ -100,7 +86,7 @@ export default class DragResizeEngine {
 
     const over = (e: MouseEvent) => {
       const handleEvents = makeEventsHandler(e, masterSensors);
-      handleEvents((doc) => {
+      handleEvents(doc => {
         doc.removeEventListener('mousemove', move, true);
         doc.removeEventListener('mouseup', over, true);
       });
@@ -115,7 +101,7 @@ export default class DragResizeEngine {
       node = boost(e);
       startEvent = createResizeEvent(e);
       const handleEvents = makeEventsHandler(e, masterSensors);
-      handleEvents((doc) => {
+      handleEvents(doc => {
         doc.addEventListener('mousemove', move, true);
         doc.addEventListener('mouseup', over, true);
       });
@@ -137,7 +123,9 @@ export default class DragResizeEngine {
     };
   }
 
-  onResize(func: (e: MouseEvent, direction: string, node: any, moveX: number, moveY: number) => any) {
+  onResize(
+    func: (e: MouseEvent, direction: string, node: any, moveX: number, moveY: number) => any,
+  ) {
     this.emitter.on('resize', func);
     return () => {
       this.emitter.removeListener('resize', func);
@@ -150,6 +138,18 @@ export default class DragResizeEngine {
       this.emitter.removeListener('resizeEnd', func);
     };
   }
+
+  private getMasterSensors(): ISimulatorHost[] {
+    return this.designer.project.documents
+      .map(doc => {
+        // TODO: not use actived,
+        if (doc.actived && doc.simulator?.sensorAvailable) {
+          return doc.simulator;
+        }
+        return null;
+      })
+      .filter(Boolean) as any;
+  }
 }
 
 // new DragResizeEngine();

packages/designer/src/builtin-simulator/bem-tools/insertion.tsx

@@ -1,6 +1,5 @@
 import { Component } from 'react';
-import { computed, observer } from '@ali/lowcode-editor-core';
-import { SimulatorContext } from '../context';
+import { observer } from '@ali/lowcode-editor-core';
 import { BuiltinSimulatorHost } from '../host';
 import {
   DropLocation,

packages/designer/src/builtin-simulator/host-view.tsx

@@ -2,7 +2,6 @@ import { Component } from 'react';
 import { observer } from '@ali/lowcode-editor-core';
 import { BuiltinSimulatorHost, BuiltinSimulatorProps } from './host';
 import { DocumentModel } from '../document';
-import { SimulatorContext } from './context';
 import { BemTools } from './bem-tools';
 import './host.less';
 
@@ -51,6 +50,7 @@ export class BuiltinSimulatorHostView extends Component<SimulatorHostProps> {
   }
 }
 
+// eslint-disable-next-line react/no-multi-comp
 @observer
 class Canvas extends Component<{ host: BuiltinSimulatorHost }> {
   render() {
@@ -73,6 +73,7 @@ class Canvas extends Component<{ host: BuiltinSimulatorHost }> {
   }
 }
 
+// eslint-disable-next-line react/no-multi-comp
 @observer
 class Content extends Component<{ host: BuiltinSimulatorHost }> {
   render() {

packages/designer/src/builtin-simulator/host.ts

@@ -60,6 +60,7 @@ export interface BuiltinSimulatorProps {
 const defaultSimulatorUrl = (() => {
   const publicPath = getPublicPath();
   let urls;
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   const [_, prefix = '', dev] = /^(.+?)(\/js)?\/?$/.exec(publicPath) || [];
   if (dev) {
     urls = [`${prefix}/css/react-simulator-renderer.css`, `${prefix}/js/react-simulator-renderer.js`];
@@ -74,6 +75,7 @@ const defaultSimulatorUrl = (() => {
 const defaultRaxSimulatorUrl = (() => {
   const publicPath = getPublicPath();
   let urls;
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   const [_, prefix = '', dev] = /^(.+?)(\/js)?\/?$/.exec(publicPath) || [];
   if (dev) {
     urls = [`${prefix}/css/rax-simulator-renderer.css`, `${prefix}/js/rax-simulator-renderer.js`];
@@ -503,11 +505,9 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
         this.disableHovering();
       }
       // sleep some autorun reaction
-    } else {
+    } else if (!this.disableHovering) {
       // weekup some autorun reaction
-      if (!this.disableHovering) {
-        this.setupDetecting();
-      }
+      this.setupDetecting();
     }
   }
 
@@ -596,14 +596,14 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
   /**
    * @see ISimulator
    */
-  getComponentInstanceId(instance: ComponentInstance) {
+  getComponentInstanceId(/* instance: ComponentInstance */) {
     throw new Error('Method not implemented.');
   }
 
   /**
    * @see ISimulator
    */
-  getComponentContext(node: Node): object {
+  getComponentContext(/* node: Node */): any {
     throw new Error('Method not implemented.');
   }
 
@@ -638,7 +638,7 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
     const elems = elements.slice();
     let rects: DOMRect[] | undefined;
     let last: { x: number; y: number; r: number; b: number } | undefined;
-    let computed = false;
+    let _computed = false;
     while (true) {
       if (!rects || rects.length < 1) {
         const elem = elems.pop();
@@ -665,26 +665,26 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
       }
       if (rect.left < last.x) {
         last.x = rect.left;
-        computed = true;
+        _computed = true;
       }
       if (rect.top < last.y) {
         last.y = rect.top;
-        computed = true;
+        _computed = true;
       }
       if (rect.right > last.r) {
         last.r = rect.right;
-        computed = true;
+        _computed = true;
       }
       if (rect.bottom > last.b) {
         last.b = rect.bottom;
-        computed = true;
+        _computed = true;
       }
     }
 
     if (last) {
       const r: any = new DOMRect(last.x, last.y, last.r - last.x, last.b - last.y);
       r.elements = elements;
-      r.computed = computed;
+      r.computed = _computed;
       return r;
     }
 
@@ -734,7 +734,7 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
   /**
    * @see ISimulator
    */
-  scrollToNode(node: Node, detail?: any, tryTimes = 0) {
+  scrollToNode(node: Node, detail?: any/* , tryTimes = 0 */) {
     this.tryScrollAgain = null;
     if (this.sensing) {
       // actived sensor
@@ -973,7 +973,7 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
       const instances = this.getComponentInstances(node);
       const inst = instances
         ? instances.length > 1
-          ? instances.find((inst) => this.getClosestNodeInstance(inst, container.id)?.instance === containerInstance)
+          ? instances.find((_inst) => this.getClosestNodeInstance(_inst, container.id)?.instance === containerInstance)
           : instances[0]
         : null;
       const rect = inst ? this.computeComponentInstanceRect(inst, node.componentMeta.rootSelector) : null;
@@ -1164,7 +1164,7 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
     return null;
   }
 
-  isAcceptable(container: ParentalNode): boolean {
+  isAcceptable(/* container: ParentalNode */): boolean {
     return false;
     /*
     const meta = container.componentMeta;
@@ -1179,7 +1179,7 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
   /**
    * 控制接受
    */
-  handleAccept({ container, instance }: DropContainer, e: LocateEvent) {
+  handleAccept({ container/* , instance */ }: DropContainer, e: LocateEvent) {
     const { dragObject } = e;
     if (isRootNode(container)) {
       return this.document.checkDropTarget(container, dragObject as any);
@@ -1227,7 +1227,7 @@ export class BuiltinSimulatorHost implements ISimulatorHost<BuiltinSimulatorProp
   /**
    * 查找邻近容器
    */
-  getNearByContainer(container: ParentalNode, e: LocateEvent) {
+  getNearByContainer(/* container: ParentalNode, e: LocateEvent */) {
     /*
     const children = container.children;
     if (!children || children.length < 1) {

packages/designer/src/builtin-simulator/live-editing/live-editing.ts

@@ -81,15 +81,15 @@ export class LiveEditing {
       }
     }
 
-    if (!propTarget) {
-      // 自动纯文本编辑满足一下情况：
-      //  1. children 内容都是 Leaf 且都是文本（一期）
-      //  2. DOM 节点是单层容器，子集都是文本节点 (已满足)
-      const isAllText = node.children?.every(item => {
-        return item.isLeaf() && item.getProp('children')?.type === 'literal';
-      });
-      // TODO:
-    }
+    // if (!propTarget) {
+    //   // 自动纯文本编辑满足一下情况：
+    //   //  1. children 内容都是 Leaf 且都是文本（一期）
+    //   //  2. DOM 节点是单层容器，子集都是文本节点 (已满足)
+    //   const isAllText = node.children?.every(item => {
+    //     return item.isLeaf() && item.getProp('children')?.type === 'literal';
+    //   });
+    //   // TODO:
+    // }
 
     if (propTarget && setterPropElement) {
       const prop = node.getProp(propTarget, true)!;
@@ -121,8 +121,10 @@ export class LiveEditing {
         console.info(e.code);
         switch (e.code) {
           case 'Enter':
+            break;
             // TODO: check is richtext?
           case 'Escape':
+            break;
           case 'Tab':
             setterPropElement?.blur();
         }
@@ -130,7 +132,7 @@ export class LiveEditing {
         // enter
         // tab
       };
-      const focusout = (e: FocusEvent) => {
+      const focusout = (/* e: FocusEvent */) => {
         this.saveAndDispose();
       };
       setterPropElement.addEventListener('focusout', focusout);

packages/designer/src/builtin-simulator/node-selector/index.tsx

@@ -71,7 +71,7 @@ export default class InstanceNodeSelector extends React.Component<IProps, IState
     }
   };
 
-  renderNodes = (node: Node) => {
+  renderNodes = (/* node: Node */) => {
     const nodes = this.state.parentNodes || [];
     const children = nodes.map((node, key) => {
       return (

packages/designer/src/builtin-simulator/resource-consumer.ts

@@ -26,14 +26,14 @@ export default class ResourceConsumer<T = any> {
 
   private _providing?: () => void;
 
+  private _consuming?: () => void;
+
   constructor(provider: () => T, private consumer?: RendererConsumer<T>) {
     this._providing = autorun(() => {
       this._data = provider();
     });
   }
 
-  private _consuming?: () => void;
-
   consume(consumerOrRenderer: BuiltinSimulatorRenderer | ((data: T) => any)) {
     if (this._consuming) {
       return;

packages/designer/src/builtin-simulator/utils/parse-metadata.ts

@@ -16,6 +16,7 @@ export const primitiveTypes = [
   'any',
 ];
 
+// eslint-disable-next-line @typescript-eslint/ban-types
 function makeRequired(propType: any, lowcodeType: string | object) {
   function lowcodeCheckTypeIsRequired(...rest: any[]) {
     return propType.isRequired(...rest);
@@ -32,6 +33,7 @@ function makeRequired(propType: any, lowcodeType: string | object) {
   return lowcodeCheckTypeIsRequired;
 }
 
+// eslint-disable-next-line @typescript-eslint/ban-types
 function define(propType: any = PropTypes.any, lowcodeType: string | object = {}) {
   if (!propType._inner && propType.name !== 'lowcodeCheckType') {
     propType.lowcodeType = lowcodeType;

packages/designer/src/builtin-simulator/utils/throttle.ts

@@ -1,5 +1,6 @@
 const useRAF = typeof requestAnimationFrame === 'function';
 
+// eslint-disable-next-line @typescript-eslint/ban-types
 export function throttle(func: Function, delay: number) {
   let lastArgs: any;
   let lastThis: any;

packages/designer/src/component-meta.ts

@@ -13,7 +13,7 @@ import {
   FieldConfig,
 } from '@ali/lowcode-types';
 import { computed } from '@ali/lowcode-editor-core';
-import { Node, ParentalNode, TransformStage } from './document';
+import { Node, ParentalNode } from './document';
 import { Designer } from './designer';
 import { intlNode } from './locale';
 import { IconContainer } from './icons/container';
@@ -231,6 +231,7 @@ export class ComponentMeta {
   }
 
   @computed get availableActions() {
+    // eslint-disable-next-line prefer-const
     let { disableBehaviors, actions } = this._transformedMetadata?.configure.component || {};
     const disabled = ensureAList(disableBehaviors) || (this.isRootComponent(false) ? ['copy', 'remove'] : null);
     actions = builtinComponentActions.concat(this.designer.getGlobalComponentActions() || [], actions || []);
@@ -331,6 +332,7 @@ registerMetadataTransducer((metadata) => {
   if (!component.nestingRule) {
     let m;
     // uri match xx.Group set subcontrolling: true, childWhiteList
+    // eslint-disable-next-line no-cond-assign
     if ((m = /^(.+)\.Group$/.exec(componentName))) {
       // component.subControlling = true;
       if (!component.nestingRule) {
@@ -338,16 +340,16 @@ registerMetadataTransducer((metadata) => {
           childWhitelist: [`${m[1]}`],
         };
       }
-    }
-    // uri match xx.Node set selfControlled: false, parentWhiteList
-    else if ((m = /^(.+)\.Node$/.exec(componentName))) {
+    // eslint-disable-next-line no-cond-assign
+    } else if ((m = /^(.+)\.Node$/.exec(componentName))) {
+      // uri match xx.Node set selfControlled: false, parentWhiteList
       // component.selfControlled = false;
       component.nestingRule = {
         parentWhitelist: [`${m[1]}`, componentName],
       };
-    }
-    // uri match .Item .Node .Option set parentWhiteList
-    else if ((m = /^(.+)\.(Item|Node|Option)$/.exec(componentName))) {
+    // eslint-disable-next-line no-cond-assign
+    } else if ((m = /^(.+)\.(Item|Node|Option)$/.exec(componentName))) {
+      // uri match .Item .Node .Option set parentWhiteList
       component.nestingRule = {
         parentWhitelist: [`${m[1]}`],
       };

packages/designer/src/designer/builtin-hotkey.ts

@@ -245,7 +245,7 @@ hotkey.bind(['option+left', 'option+right'], (e, action) => {
   }
 });
 
-hotkey.bind(['option+up'], (e, action) => {
+hotkey.bind(['option+up'], (e) => {
   const designer = focusing.focusDesigner;
   const doc = designer?.currentDocument;
   if (isFormEvent(e) || !doc) {
@@ -283,7 +283,7 @@ hotkey.bind(['option+up'], (e, action) => {
   }
 });
 
-hotkey.bind(['option+down'], (e, action) => {
+hotkey.bind(['option+down'], (e) => {
   const designer = focusing.focusDesigner;
   const doc = designer?.currentDocument;
   if (isFormEvent(e) || !doc) {

packages/designer/src/designer/designer-view.tsx

@@ -44,7 +44,7 @@ export class DesignerView extends Component<DesignerProps & {
     this.designer.postEvent('mount', this.designer);
   }
 
-  componentWillMount() {
+  UNSAFE_componentWillMount() {
     this.designer.purge();
   }
 

packages/designer/src/designer/designer.ts

@@ -136,6 +136,7 @@ export class Designer {
               [npm?.package, npm?.componentName].filter((item) => !!item).join('-') ||
               parent?.componentMeta?.componentName ||
               '';
+            // eslint-disable-next-line no-unused-expressions
             this.editor?.emit('designer.drag', {
               time: (endTime - startTime).toFixed(2),
               selected: nodes
@@ -143,6 +144,7 @@ export class Designer {
                   if (!n) {
                     return;
                   }
+                  // eslint-disable-next-line no-shadow
                   const npm = n?.componentMeta?.npm;
                   return (
                     [npm?.package, npm?.componentName].filter((item) => !!item).join('-') ||

packages/designer/src/designer/dragon.ts

@@ -77,6 +77,7 @@ export interface ISensor {
 export type DragObject = DragNodeObject | DragNodeDataObject | DragAnyObject;
 
 export enum DragObjectType {
+  // eslint-disable-next-line no-shadow
   Node = 'node',
   NodeData = 'nodedata',
 }
@@ -204,8 +205,7 @@ export class Dragon {
 
   private emitter = new EventEmitter();
 
-  constructor(readonly designer: Designer) {
-  }
+  constructor(readonly designer: Designer) {}
 
   /**
    * Quick listen a shell(container element) drag behavior

packages/designer/src/designer/offset-observer.ts

@@ -134,7 +134,8 @@ export class OffsetObserver {
         this._bottom = rect.bottom;
         this.hasOffset = true;
       }
-      this.pid = pid = (window as any).requestIdleCallback(compute);
+      this.pid = (window as any).requestIdleCallback(compute);
+      pid = this.pid;
     };
 
     this.compute = compute;
@@ -142,7 +143,8 @@ export class OffsetObserver {
     // try first
     compute();
     // try second, ensure the dom mounted
-    this.pid = pid = (window as any).requestIdleCallback(compute);
+    this.pid = (window as any).requestIdleCallback(compute);
+    pid = this.pid;
   }
 
   purge() {

packages/designer/src/designer/scroller.ts

@@ -53,6 +53,8 @@ export interface IScrollable {
 export class Scroller {
   private pid: number | undefined;
 
+  constructor(private scrollable: IScrollable) {}
+
   get scrollTarget(): ScrollTarget | null {
     let target = this.scrollable.scrollTarget;
     if (!target) {
@@ -65,8 +67,6 @@ export class Scroller {
     return target;
   }
 
-  constructor(private scrollable: IScrollable) {}
-
   scrollTo(options: { left?: number; top?: number }) {
     this.cancel();
 
@@ -109,13 +109,15 @@ export class Scroller {
       scrollTarget.scrollTo(opt);
 
       if (time < 1) {
-        this.pid = pid = requestAnimationFrame(animate);
+        this.pid = requestAnimationFrame(animate);
+        pid = this.pid;
       } else {
         end();
       }
     };
 
-    this.pid = pid = requestAnimationFrame(animate);
+    this.pid = requestAnimationFrame(animate);
+    pid = this.pid;
   }
 
   scrolling(point: { globalX: number; globalY: number }) {

packages/designer/src/designer/setting/setting-prop-entry.ts

@@ -1,4 +1,4 @@
-import { obx, computed, autorun } from '@ali/lowcode-editor-core';
+import { obx, computed } from '@ali/lowcode-editor-core';
 import { IEditor, isJSExpression } from '@ali/lowcode-types';
 import { uniqueId } from '@ali/lowcode-utils';
 import { SettingEntry } from './setting-entry';

packages/designer/src/designer/setting/setting-top-entry.ts

@@ -2,7 +2,7 @@ import { EventEmitter } from 'events';
 import { CustomView, isCustomView, IEditor } from '@ali/lowcode-types';
 import { computed } from '@ali/lowcode-editor-core';
 import { SettingEntry } from './setting-entry';
-import { SettingField, isSettingField } from './setting-field';
+import { SettingField } from './setting-field';
 import { SettingPropEntry } from './setting-prop-entry';
 import { Node } from '../../document';
 import { ComponentMeta } from '../../component-meta';

packages/designer/src/document/document-model.ts

@@ -672,7 +672,7 @@ export class DocumentModel {
   /**
    * @deprecated
    */
-  onRefresh(func: () => void) {
+  onRefresh(/* func: () => void */) {
     console.warn('onRefresh method is deprecated');
   }
 }

packages/designer/src/document/node/modal-nodes-manager.ts

@@ -112,7 +112,7 @@ export class ModalNodesManager {
 
   private addNodeEvent(node: Node) {
     this.nodeRemoveEvents[node.getId()] =
-      node.onVisibleChange((flag) => {
+      node.onVisibleChange(() => {
         this.emitter.emit('visibleChange');
       });
   }

packages/designer/src/document/node/node-children.ts

@@ -129,7 +129,7 @@ export class NodeChildren {
       node.internalSetParent(null, useMutator);
       try {
         node.purge(useMutator);
-      } catch(err) {
+      } catch (err) {
         console.error(err);
       }
     }

packages/designer/src/document/node/node.ts

@@ -431,7 +431,7 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
     return false;
   }
 
-  wrapWith(schema: Schema) {
+  wrapWith(/* schema: Schema */) {
     // todo
   }
 
@@ -725,7 +725,7 @@ export class Node<Schema extends NodeSchema = NodeSchema> {
   /**
    * 销毁
    */
-  purge(useMutator = true) {
+  purge() {
     if (this.purged) {
       return;
     }
@@ -1066,7 +1066,7 @@ export function insertChildren(
   let index = at;
   let node: any;
   const results: Node[] = [];
-  // tslint:disable-next-line
+  // eslint-disable-next-line no-cond-assign
   while ((node = nodes.pop())) {
     node = insertChild(container, node, index, copy);
     results.push(node);

packages/designer/src/document/node/props/props.ts

@@ -153,41 +153,41 @@ export class Props implements IPropParent {
   query(path: string, stash = true): Prop | null {
     return this.get(path, stash);
     // todo: future support list search
-    let matchedLength = 0;
-    let firstMatched = null;
-    if (this.items) {
-      // target: a.b.c
-      // trys: a.b.c, a.b, a
-      let i = this.items.length;
-      while (i-- > 0) {
-        const expr = this.items[i];
-        if (!expr.key) {
-          continue;
-        }
-        const name = String(expr.key);
-        if (name === path) {
-          // completely match
-          return expr;
-        }
+    // let matchedLength = 0;
+    // let firstMatched = null;
+    // if (this.items) {
+    //   // target: a.b.c
+    //   // trys: a.b.c, a.b, a
+    //   let i = this.items.length;
+    //   while (i-- > 0) {
+    //     const expr = this.items[i];
+    //     if (!expr.key) {
+    //       continue;
+    //     }
+    //     const name = String(expr.key);
+    //     if (name === path) {
+    //       // completely match
+    //       return expr;
+    //     }
 
-        // fisrt match
-        const l = name.length;
-        if (path.slice(0, l + 1) === `${name}.`) {
-          matchedLength = l;
-          firstMatched = expr;
-        }
-      }
-    }
+    //     // fisrt match
+    //     const l = name.length;
+    //     if (path.slice(0, l + 1) === `${name}.`) {
+    //       matchedLength = l;
+    //       firstMatched = expr;
+    //     }
+    //   }
+    // }
 
-    let ret = null;
-    if (firstMatched) {
-      ret = firstMatched.get(path.slice(matchedLength + 1), true);
-    }
-    if (!ret && stash) {
-      return this.stash.get(path);
-    }
+    // let ret = null;
+    // if (firstMatched) {
+    //   ret = firstMatched.get(path.slice(matchedLength + 1), true);
+    // }
+    // if (!ret && stash) {
+    //   return this.stash.get(path);
+    // }
 
-    return ret;
+    // return ret;
   }
 
   /**

packages/designer/src/document/node/props/value-to-source.ts

@@ -4,6 +4,7 @@ function propertyNameRequiresQuotes(propertyName: string) {
       worksWithoutQuotes: false,
     };
 
+    // eslint-disable-next-line no-new-func
     new Function('ctx', `ctx.worksWithoutQuotes = {${propertyName}: true}['${propertyName}']`)();
 
     return !context.worksWithoutQuotes;
@@ -225,7 +226,9 @@ export function getSource(value: any): string {
   if (value) {
     try {
       value.__source = source;
-    } catch (ex) {}
+    } catch (ex) {
+      console.error(ex);
+    }
   }
   return source;
 }

packages/designer/src/document/selection.ts

@@ -8,6 +8,8 @@ export class Selection {
 
   @obx.val private _selected: string[] = [];
 
+  constructor(readonly doc: DocumentModel) {}
+
   /**
    * 选中的节点 id
    */
@@ -15,8 +17,6 @@ export class Selection {
     return this._selected;
   }
 
-  constructor(readonly doc: DocumentModel) {}
-
   /**
    * 选中
    */

packages/designer/src/project/project.ts

@@ -36,10 +36,10 @@ export class Project {
 
   /**
    * 替换当前document的schema,并触发渲染器的render
-   * @param schema 
+   * @param schema
    */
-  setSchema(schema?: ProjectSchema){
-    let doc = this.documents.find((doc) => doc.actived);
+  setSchema(schema?: ProjectSchema) {
+    const doc = this.documents.find((doc) => doc.actived);
     doc && doc.import(schema?.componentsTree[0]);
   }
 
@@ -91,6 +91,7 @@ export class Project {
    * 分字段设置储存数据，不记录操作记录
    */
   set(
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
     key:
     | 'version'
     | 'componentsTree'
@@ -101,6 +102,7 @@ export class Project {
     | 'css'
     | 'dataSource'
     | string,
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
     value: any,
   ): void {}
 
@@ -108,6 +110,7 @@ export class Project {
    * 分字段设置储存数据
    */
   get(
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
     key:
     | 'version'
     | 'componentsTree'

packages/editor-core/.eslintrc.js

@@ -0,0 +1,14 @@
+module.exports = {
+  extends: 'eslint-config-ali/typescript/react',
+  rules: {
+    'react/no-multi-comp': 1,
+    'no-unused-expressions': 1,
+    'implicit-arrow-linebreak': 1,
+    'no-nested-ternary': 1,
+    'no-mixed-operators': 1,
+    '@typescript-eslint/no-parameter-properties': 1,
+    '@typescript-eslint/ban-types': 1,
+    'no-shadow': 1,
+    'no-prototype-builtins': 1,
+  }
+}

packages/editor-core/build.plugin.js

@@ -1,5 +1,4 @@
 const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
-const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin');
 
 module.exports = ({ onGetWebpackConfig }) => {
   onGetWebpackConfig((config) => {

packages/editor-core/src/editor.ts

@@ -11,7 +11,7 @@ import {
 import { IocContext, RegisterOptions } from './di';
 import { globalLocale } from './intl';
 import * as utils from './utils';
-import { tipHandler } from './widgets/tip/tip-handler';
+// import { tipHandler } from './widgets/tip/tip-handler';
 
 EventEmitter.defaultMaxListeners = 100;
 
@@ -22,7 +22,7 @@ export class Editor extends EventEmitter implements IEditor {
    * Ioc Container
    */
   private context = new IocContext({
-    notFoundHandler: (type: KeyType) => NOT_FOUND,
+    notFoundHandler: (/* type: KeyType */) => NOT_FOUND,
   });
 
   get locale() {
@@ -92,7 +92,7 @@ export class Editor extends EventEmitter implements IEditor {
   async init(config?: EditorConfig, components?: PluginClassSet): Promise<any> {
     this.config = config || {};
     this.components = components || {};
-    const { shortCuts = [], hooks = [], lifeCycles } = this.config;
+    const { hooks = [], lifeCycles } = this.config;
 
     this.emit('editor.beforeInit');
     const init = (lifeCycles && lifeCycles.init) || ((): void => {});
@@ -116,7 +116,7 @@ export class Editor extends EventEmitter implements IEditor {
       return;
     }
     try {
-      const { shortCuts = [], lifeCycles = {} } = this.config;
+      const { lifeCycles = {} } = this.config;
       // unRegistShortCuts(shortCuts);
 
       this.unregisterHooks();

packages/editor-core/src/hotkey.ts

@@ -588,7 +588,6 @@ export class Hotkey {
     combination = combination.replace(/\s+/g, ' ');
 
     const sequence: string[] = combination.split(' ');
-    let info: KeyInfo;
 
     // if this pattern is a sequence of keys then run through this method
     // to reprocess each pattern one key at a time
@@ -597,7 +596,7 @@ export class Hotkey {
       return;
     }
 
-    info = getKeyInfo(combination, action);
+    const info: KeyInfo = getKeyInfo(combination, action);
 
     // make sure to initialize array if this is the first time
     // a callback is added for this key

packages/editor-core/src/widgets/tip/tip-container.tsx

@@ -20,7 +20,7 @@ export class TipContainer extends Component {
     };
   }
 
-  componentWillMount() {
+  UNSAFE_componentWillMount() {
     if (this.dispose) {
       this.dispose();
     }

packages/editor-core/src/widgets/title/index.tsx

@@ -25,6 +25,7 @@ export class Title extends Component<{ title: TitleContent; className?: string;
   }
 
   render() {
+    // eslint-disable-next-line prefer-const
     let { title, className } = this.props;
     if (title == null) {
       return null;

packages/editor-preset-vision/.eslintrc.js

@@ -0,0 +1,14 @@
+module.exports = {
+  extends: 'eslint-config-ali/typescript/react',
+  rules: {
+    'react/no-multi-comp': 1,
+    'no-unused-expressions': 1,
+    'implicit-arrow-linebreak': 1,
+    'no-nested-ternary': 1,
+    'no-mixed-operators': 1,
+    '@typescript-eslint/no-parameter-properties': 1,
+    '@typescript-eslint/ban-types': 1,
+    'no-shadow': 1,
+    'no-prototype-builtins': 1,
+  }
+}

packages/editor-skeleton/.eslintrc.js

@@ -0,0 +1,16 @@
+module.exports = {
+  extends: 'eslint-config-ali/typescript/react',
+  rules: {
+    'react/no-multi-comp': 1,
+    'no-unused-expressions': 1,
+    'implicit-arrow-linebreak': 1,
+    'no-nested-ternary': 1,
+    'no-mixed-operators': 1,
+    '@typescript-eslint/no-parameter-properties': 1,
+    '@typescript-eslint/ban-types': 1,
+    'no-shadow': 1,
+    'no-prototype-builtins': 1,
+    'no-confusing-arrow': 1,
+    'no-case-declarations': 1,
+  }
+}

packages/editor-skeleton/src/components/array-setter/index.tsx

@@ -74,7 +74,7 @@ export class ListSetter extends Component<ArraySetterProps, ArraySetterState> {
   onSort(sortedIds: Array<string | number>) {
     const { itemsMap } = this.state;
     const { onChange, itemSetter, field } = this.props;
-    const items = sortedIds.map((id, index) => {
+    const items = sortedIds.map((id) => {
       const item = itemsMap.get(id)!;
       // item.setKey(index);
       return item;
@@ -85,7 +85,8 @@ export class ListSetter extends Component<ArraySetterProps, ArraySetterState> {
     });
 
     // 对itemsMap重新生成并刷新当前setter数据
-    const newItems = []; const newItemsMap = {};
+    const newItems = [];
+    // const newItemsMap = {};
     itemsMap.clear();
     for (let i = 0; i < items.length; i++) {
       const newItem = field.createField({
@@ -128,7 +129,7 @@ export class ListSetter extends Component<ArraySetterProps, ArraySetterState> {
   }
 
   onRemove(field: SettingField) {
-    const { onChange, itemSetter } = this.props;
+    const { onChange } = this.props;
     const { items, itemsMap } = this.state;
     let i = items.indexOf(field);
     const values = items.map((item) => {
@@ -235,7 +236,7 @@ class ArrayItem extends Component<{
   render() {
     const { onRemove, field } = this.props;
     return (
-      <div className="lc-listitem" ref={(ref) => (this.shell = ref)}>
+      <div className="lc-listitem" ref={(ref) => { this.shell = ref; }}>
         <div draggable className="lc-listitem-handler">
           <Icon type="ellipsis" size="small" />
         </div>

packages/editor-skeleton/src/components/field/fields.tsx

@@ -35,6 +35,7 @@ export class Field extends Component<FieldProps> {
 
   private toggleExpand = () => {
     const { onExpandChange } = this.props;
+    // eslint-disable-next-line react/no-access-state-in-setstate
     const collapsed = !this.state.collapsed;
     this.setState({
       collapsed,
@@ -130,7 +131,7 @@ export class Field extends Component<FieldProps> {
       return null;
     }
 
-    const { className, children, meta, title, valueState, onClear, name: propName, tip } = this.props;
+    const { className, children, meta, title, valueState, name: propName, tip } = this.props;
     const { display, collapsed } = this.state;
     const isAccordion = display === 'accordion';
     let hostName = '';
@@ -160,7 +161,7 @@ export class Field extends Component<FieldProps> {
             </div>
           )
         }
-        <div key="body" ref={(shell) => (this.body = shell)} className="lc-field-body">
+        <div key="body" ref={(shell) => { this.body = shell; }} className="lc-field-body">
           {children}
         </div>
       </div>
@@ -179,7 +180,7 @@ export class Field extends Component<FieldProps> {
  *
  * TODO: turn number to enum
  */
-function createValueState(valueState?: number, onClear?: (e: React.MouseEvent) => void) {
+function createValueState(/* valueState?: number, onClear?: (e: React.MouseEvent) => void */) {
   return null;
   /*
   let tip: any = null;

packages/editor-skeleton/src/components/mixed-setter/index.tsx

@@ -146,7 +146,7 @@ export default class MixedSetter extends Component<{
   private hasVariableSetter = this.setters.some((item) => item.name === 'VariableSetter');
 
   private useSetter = (name: string) => {
-    const { field, onChange } = this.props;
+    const { field } = this.props;
     if (name === 'VariableSetter') {
       const setterComponent = getSetter('VariableSetter')?.component as any;
       if (setterComponent && setterComponent.isPopup) {
@@ -350,7 +350,7 @@ export default class MixedSetter extends Component<{
     }
 
     return (
-      <div ref={(shell) => (this.shell = shell)} className={classNames('lc-setter-mixed', className)}>
+      <div ref={(shell) => { this.shell = shell; }} className={classNames('lc-setter-mixed', className)}>
         {contents.setterContent}
         <div className="lc-setter-actions">{contents.actions}</div>
       </div>

packages/editor-skeleton/src/components/settings/settings-pane.tsx

@@ -1,5 +1,5 @@
 import { Component, MouseEvent, Fragment } from 'react';
-import { shallowIntl, createSetterContent, observer, obx, Title } from '@ali/lowcode-editor-core';
+import { shallowIntl, createSetterContent, observer, obx } from '@ali/lowcode-editor-core';
 import { createContent } from '@ali/lowcode-utils';
 import { createField } from '../field';
 import PopupService, { PopupPipe } from '../popup';
@@ -12,6 +12,7 @@ import { Skeleton } from 'editor-skeleton/src/skeleton';
 
 function transformStringToFunction(str) {
   if (typeof str !== 'string') return str;
+  // eslint-disable-next-line no-new-func
   return new Function(`"use strict"; return ${str}`)();
 }
 
@@ -128,6 +129,7 @@ class SettingFieldView extends Component<{ field: SettingField }> {
           value, // reaction point
           onChange: (value: any) => {
             this.setState({
+              // eslint-disable-next-line react/no-unused-state
               value,
             });
             field.setValue(value);
@@ -139,6 +141,7 @@ class SettingFieldView extends Component<{ field: SettingField }> {
             }
             const value = typeof initialValue === 'function' ? initialValue(field) : initialValue;
             this.setState({
+              // eslint-disable-next-line react/no-unused-state
               value,
             });
             field.setValue(value);

packages/editor-skeleton/src/components/slot-setter/index.tsx

@@ -11,7 +11,7 @@ export default class SlotSetter extends Component<{
   supportParams?: boolean;
 }> {
   private handleInitial = () => {
-    const { value, onChange, onInitial } = this.props;
+    const { onChange, onInitial } = this.props;
     if (onInitial) {
       onInitial();
       return;

packages/editor-skeleton/src/register-defaults.ts

@@ -7,7 +7,7 @@ import { isPlainObject } from '@ali/lowcode-utils';
 import parseProps from './transducers/parse-props';
 import addonCombine from './transducers/addon-combine';
 import SlotSetter from './components/slot-setter';
-import { isJSSlot, isJSExpression } from '@ali/lowcode-types';
+import { isJSSlot } from '@ali/lowcode-types';
 
 export const registerDefaults = () => {
   registerSetter('ArraySetter', {

packages/editor-skeleton/src/transducers/parse-props.ts

@@ -4,7 +4,6 @@ import {
   PropType,
   SetterType,
   OneOf,
-  Shape,
   ObjectOf,
   ArrayOf,
   TransformedComponentMetadata,

packages/editor-skeleton/src/widget/panel-dock.ts

@@ -52,6 +52,7 @@ export default class PanelDock implements IWidget {
   }
 
   getDOMNode() {
+    // eslint-disable-next-line react/no-find-dom-node
     return this._shell ? findDOMNode(this._shell) : null;
   }
 

packages/editor-skeleton/src/widget/panel.ts

@@ -82,7 +82,7 @@ export default class Panel implements IWidget {
 
   constructor(readonly skeleton: Skeleton, readonly config: PanelConfig) {
     const { name, content, props = {} } = config;
-    const { hideTitleBar, title, icon, description, help, shortcut } = props;
+    const { hideTitleBar, title, icon, description, help } = props;
     this.name = name;
     this.id = uniqueId(`pane:${name}$`);
     this.title = composeTitle(title || name, icon, description);
@@ -207,7 +207,7 @@ export default class Panel implements IWidget {
   /**
    * @deprecated
    */
-  setPosition(position: string) {
+  setPosition(/* position: string */) {
     // noop
   }
 

packages/editor-skeleton/src/widget/stage.ts

@@ -1,4 +1,4 @@
-import { uniqueId } from '@ali/lowcode-utils';
+// import { uniqueId } from '@ali/lowcode-utils';
 import Widget from './widget';
 import { Skeleton } from '../skeleton';
 import { WidgetConfig } from '../types';

packages/editor-skeleton/src/widget/widget-container.ts

@@ -25,12 +25,14 @@ export default class WidgetContainer<T extends WidgetItem = any, G extends Widge
     return this._current;
   }
 
+  // eslint-disable-next-line no-useless-constructor
   constructor(
     readonly name: string,
     private handle: (item: T | G) => T,
     private exclusive: boolean = false,
     private checkVisible: () => boolean = () => true,
     private defaultSetCurrent: boolean = false,
+  // eslint-disable-next-line no-empty-function
   ) {}
 
   @computed get visible() {

packages/plugin-designer/.eslintrc.js

@@ -0,0 +1,14 @@
+module.exports = {
+  extends: 'eslint-config-ali/typescript/react',
+  rules: {
+    'react/no-multi-comp': 1,
+    'no-unused-expressions': 1,
+    'implicit-arrow-linebreak': 1,
+    'no-nested-ternary': 1,
+    'no-mixed-operators': 1,
+    '@typescript-eslint/no-parameter-properties': 1,
+    '@typescript-eslint/ban-types': 1,
+    'no-shadow': 1,
+    'no-prototype-builtins': 1,
+  }
+}

packages/rax-simulator-renderer/.eslintrc.js

@@ -0,0 +1,14 @@
+module.exports = {
+  extends: 'eslint-config-ali/typescript/react',
+  rules: {
+    'react/no-multi-comp': 1,
+    'no-unused-expressions': 1,
+    'implicit-arrow-linebreak': 1,
+    'no-nested-ternary': 1,
+    'no-mixed-operators': 1,
+    '@typescript-eslint/no-parameter-properties': 1,
+    '@typescript-eslint/ban-types': 1,
+    'no-shadow': 1,
+    'no-prototype-builtins': 1,
+  }
+}

packages/rax-simulator-renderer/src/renderer-view.tsx

@@ -20,7 +20,9 @@ const originCloneElement = (window as any).Rax.cloneElement;
         } else {
           try {
             cRef.current = x;
-          } catch (e) {}
+          } catch (e) {
+            console.error(e);
+          }
         }
       }
       if (dRef) {
@@ -29,7 +31,9 @@ const originCloneElement = (window as any).Rax.cloneElement;
         } else {
           try {
             dRef.current = x;
-          } catch (e) {}
+          } catch (e) {
+            console.error(e);
+          }
         }
       }
     };

packages/rax-simulator-renderer/src/renderer.ts

@@ -2,7 +2,7 @@ import { BuiltinSimulatorRenderer, NodeInstance, Component } from '@ali/lowcode-
 import { shared, render as raxRender, createElement } from 'rax';
 import DriverUniversal from 'driver-universal';
 import { computed, obx } from '@recore/obx';
-import { RootSchema, NpmInfo, ComponentSchema } from '@ali/lowcode-types';
+import { RootSchema, NpmInfo } from '@ali/lowcode-types';
 import { Asset, isReactComponent, isESModule, setNativeSelection, cursor, isElement } from '@ali/lowcode-utils';
 
 import SimulatorRendererView from './renderer-view';
@@ -135,7 +135,7 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
         this.buildComponents();
       }
     });
-    host.injectionConsumer.consume((data) => {
+    host.injectionConsumer.consume(() => {
       // sync utils, i18n, contants,... config
       this._appContext = {
         utils: {},
@@ -183,7 +183,7 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
     // return null;
   }
 
-  createComponent(schema: ComponentSchema): Component | null {
+  createComponent(/* schema: ComponentSchema */): Component | null {
     return null;
   }
 
@@ -404,7 +404,7 @@ function buildComponents(libraryMap: LibraryMap, componentsMap: { [componentName
   return components;
 }
 
-function getClosestNodeInstance(from: any, specId?: string): NodeInstance<any> | null {
+function getClosestNodeInstance(from: any): NodeInstance<any> | null {
   const el: any = from;
   if (el) {
     // if (isElement(el)) {

packages/rax-simulator-renderer/src/utils/find-dom-nodes.ts

@@ -9,6 +9,7 @@ export function raxFindDOMNodes(instance: any): Array<Element | Text> | null {
   if (isElement(instance)) {
     return [instance];
   }
+  // eslint-disable-next-line react/no-find-dom-node
   const result = findDOMNode(instance);
   if (Array.isArray(result)) {
     return result;

packages/react-renderer/package.json

@@ -53,5 +53,5 @@
   "publishConfig": {
     "registry": "http://registry.npm.alibaba-inc.com"
   },
-  "homepage": "https://unpkg.alibaba-inc.com/@ali/lowcode-react-renderer@1.0.7-0/build/index.html"
+  "homepage": "https://unpkg.alibaba-inc.com/@ali/lowcode-react-renderer@1.0.8-0/build/index.html"
 }

packages/react-simulator-renderer/.eslintrc.js

@@ -0,0 +1,15 @@
+module.exports = {
+  extends: 'eslint-config-ali/typescript/react',
+  rules: {
+    'react/no-multi-comp': 1,
+    'no-unused-expressions': 1,
+    'implicit-arrow-linebreak': 1,
+    'no-nested-ternary': 1,
+    'no-mixed-operators': 1,
+    '@typescript-eslint/no-parameter-properties': 1,
+    '@typescript-eslint/ban-types': 1,
+    'no-shadow': 1,
+    'no-prototype-builtins': 1,
+    'array-callback-return': 1,
+  }
+}

packages/react-simulator-renderer/src/builtin-components/builtin-components.ts

@@ -152,6 +152,7 @@ const supportedEvents = [
   },
 ];
 
+// eslint-disable-next-line func-call-spacing
 const builtinComponents = new Map<string, (props: any) => ReactElement>();
 function getBlockElement(tag: string): (props: any) => ReactElement {
   if (builtinComponents.has(tag)) {

packages/react-simulator-renderer/src/renderer-view.tsx

@@ -19,7 +19,9 @@ const originCloneElement = window.React.cloneElement;
         } else {
           try {
             cRef.current = x;
-          } catch (e) {}
+          } catch (e) {
+            console.error(e);
+          }
         }
       }
       if (dRef) {
@@ -28,7 +30,9 @@ const originCloneElement = window.React.cloneElement;
         } else {
           try {
             dRef.current = x;
-          } catch (e) {}
+          } catch (e) {
+            console.error(e);
+          }
         }
       }
     };

packages/react-simulator-renderer/src/renderer.ts

@@ -1,4 +1,4 @@
-import React, { createElement, ReactInstance, ComponentType, ReactElement, FunctionComponent } from 'react';
+import React, { createElement, ReactInstance } from 'react';
 import { render as reactRender } from 'react-dom';
 import { host } from './host';
 import SimulatorRendererView from './renderer-view';
@@ -63,7 +63,7 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
         this.buildComponents();
       }
     });
-    host.injectionConsumer.consume((data) => {
+    host.injectionConsumer.consume(() => {
       // sync utils, i18n, contants,... config
       this._appContext = {
         utils: {},
@@ -237,8 +237,6 @@ export class SimulatorRenderer implements BuiltinSimulatorRenderer {
       subs.unshift(sub);
       componentName = paths.join('.');
     }
-
-    return null;
   }
 
   getComponentInstances(id: string): ReactInstance[] | null {