diff --git a/compiler/src/interop/src/pre_define.ts b/compiler/src/interop/src/pre_define.ts
index ea279360b0b360b27e894b03650a4e96865e39c7..e194954164ea184143c0ff8e6bbb2c30d8d5fbf5 100644
--- a/compiler/src/interop/src/pre_define.ts
+++ b/compiler/src/interop/src/pre_define.ts
@@ -657,6 +657,9 @@ export const IS_INITIAL_ITEM = 'isInitialItem';
 export const MY_IDS = 'myIds';
 export const COMPONENT_CALL: string = 'componentCall';
 
+export const BUILDCOMPATIBLENODE = '_buildCompatibleNode';
+export const OPTIONS = 'options';
+
 export const TS_BUILD_INFO_SUFFIX = '.tsbuildinfo';
 export const ARKTS_LINTER_BUILD_INFO_SUFFIX = 'inversedArkTsLinter.tsbuildinfo';
 export const HOT_RELOAD_BUILD_INFO_SUFFIX = 'hotReload.tsbuildinfo';
diff --git a/compiler/src/interop/src/process_component_build.ts b/compiler/src/interop/src/process_component_build.ts
index 7b7623e503b9bf51023501a4308f078f1f873bfe..037efb0b8bacb4900450d2a806c195ec7691fe8a 100644
--- a/compiler/src/interop/src/process_component_build.ts
+++ b/compiler/src/interop/src/process_component_build.ts
@@ -514,6 +514,22 @@ export function processComponentChild(node: ts.Block | ts.SourceFile, newStateme
             }
             break;
           }
+          case ComponentType.arkoalaComponent: {
+            const idName: ts.Expression = checkIdInIf(item, savedParent);
+            parent = undefined;
+            if (!newsupplement.isAcceleratePreview) {
+              if (item.expression && ts.isEtsComponentExpression(item.expression) && item.expression.body) {
+                const expressionResult: ts.ExpressionStatement =
+                  processExpressionStatementChange(item, item.expression.body, log);
+                if (expressionResult) {
+                  item = expressionResult;
+                }
+              }
+              processCustomComponent(item as ts.ExpressionStatement, newStatements, log, name,
+                isBuilder, isGlobalBuilder, idName, builderParamsResult, isInRepeatTemplate, true);
+            }
+            break;
+          }
           case ComponentType.forEachComponent:
             parent = undefined;
             if (!partialUpdateConfig.partialUpdateMode) {
@@ -3329,7 +3345,8 @@ enum ComponentType {
   builderParamMethod,
   function,
   builderTypeFunction,
-  repeatComponent
+  repeatComponent,
+  arkoalaComponent
 }
 
 function isEtsComponent(node: ts.ExpressionStatement): boolean {
@@ -3365,12 +3382,16 @@ function getComponentType(node: ts.ExpressionStatement, log: LogInfo[], name: st
     isLocalBuilderName = false;
   }
   if (isEtsComponent(node)) {
-    if (componentCollection.customComponents.has(name)) {
+    if (componentCollection.arkoalaComponents.has(name)) {
+      return ComponentType.arkoalaComponent;
+    } else if (componentCollection.customComponents.has(name)) {
       isCustomComponentAttributes(node, log);
       return ComponentType.customComponent;
     } else {
       return ComponentType.innerComponent;
     }
+  } else if (!isPartMethod(node) && componentCollection.arkoalaComponents.has(name)) {
+    return ComponentType.arkoalaComponent;
   } else if (!isPartMethod(node) && componentCollection.customComponents.has(name)) {
     isCustomComponentAttributes(node, log);
     return ComponentType.customComponent;
diff --git a/compiler/src/interop/src/process_custom_component.ts b/compiler/src/interop/src/process_custom_component.ts
index 7aaec808ec18bdb5c1c9b2c5d1cefbc0d12c9dd4..eea1337749502abfe508ee22bf9939a3aa44155a 100644
--- a/compiler/src/interop/src/process_custom_component.ts
+++ b/compiler/src/interop/src/process_custom_component.ts
@@ -62,7 +62,11 @@ import {
   COMPONENT_LOCAL_STORAGE_LINK_DECORATOR,
   COMPONENTV2_LOCAL_DECORATOR,
   COMPONENTV2_CONSUMER_DECORATOR,
-  COMPONENTV2_PROVIDER_DECORATOR
+  COMPONENTV2_PROVIDER_DECORATOR,
+  BUILDCOMPATIBLENODE,
+  OPTIONS,
+  VIEWSTACKPROCESSOR,
+  PUSH
 } from './pre_define';
 import {
   stateCollection,
@@ -131,13 +135,14 @@ import processStructComponentV2, { StructInfo, ParamDecoratorInfo } from './proc
 import constantDefine from './constant_define';
 import createAstNodeUtils from './create_ast_node_utils';
 import logMessageCollection from './log_message_collection';
+import { printOriginNode } from './ts_printer';
 
 let decoractorMap: Map<string, Map<string, Set<string>>>;
 
 export function processCustomComponent(node: ts.ExpressionStatement, newStatements: ts.Statement[],
   log: LogInfo[], name: string, isBuilder: boolean = false, isGlobalBuilder: boolean = false,
   idName: ts.Expression = undefined, builderParamsResult: BuilderParamsResult = null,
-  isInRepeatTemplate: boolean = false): void {
+  isInRepeatTemplate: boolean = false, isArkoala: boolean = false): void {
   decoractorMap = new Map(
     [[COMPONENT_STATE_DECORATOR, stateCollection],
       [COMPONENT_LINK_DECORATOR, linkCollection],
@@ -212,7 +217,7 @@ export function processCustomComponent(node: ts.ExpressionStatement, newStatemen
       newStatements.push(createRecycleComponent(isGlobalBuilder));
     }
     addCustomComponent(node, newStatements, customComponentNewExpression, log, name, componentNode,
-      isBuilder, isGlobalBuilder, isRecycleComponent, componentAttrInfo, builderParamsResult, isReuseComponentInV2);
+      isBuilder, isGlobalBuilder, isRecycleComponent, componentAttrInfo, builderParamsResult, isReuseComponentInV2, isArkoala);
     if (hasChainCall && (!partialUpdateConfig.partialUpdateMode || needCommon)) {
       newStatements.push(ts.factory.createExpressionStatement(
         createFunction(ts.factory.createIdentifier(COMPONENT_COMMON),
@@ -317,12 +322,12 @@ function addCustomComponent(node: ts.ExpressionStatement, newStatements: ts.Stat
   newNode: ts.NewExpression, log: LogInfo[], name: string, componentNode: ts.CallExpression,
   isBuilder: boolean, isGlobalBuilder: boolean, isRecycleComponent: boolean,
   componentAttrInfo: ComponentAttrInfo, builderParamsResult: BuilderParamsResult,
-  isReuseComponentInV2: boolean): void {
+  isReuseComponentInV2: boolean, isArkoala: boolean = false): void {
   if (ts.isNewExpression(newNode)) {
     const propertyArray: ts.ObjectLiteralElementLike[] = [];
     validateCustomComponentPrams(componentNode, name, propertyArray, log, isBuilder);
     addCustomComponentStatements(node, newStatements, newNode, name, propertyArray, componentNode,
-      isBuilder, isGlobalBuilder, isRecycleComponent, componentAttrInfo, builderParamsResult, log, isReuseComponentInV2);
+      isBuilder, isGlobalBuilder, isRecycleComponent, componentAttrInfo, builderParamsResult, log, isReuseComponentInV2, isArkoala);
   }
 }
 
@@ -330,7 +335,8 @@ function addCustomComponentStatements(node: ts.ExpressionStatement, newStatement
   newNode: ts.NewExpression, name: string, props: ts.ObjectLiteralElementLike[],
   componentNode: ts.CallExpression, isBuilder: boolean, isGlobalBuilder: boolean,
   isRecycleComponent: boolean, componentAttrInfo: ComponentAttrInfo,
-  builderParamsResult: BuilderParamsResult, log: LogInfo[], isReuseComponentInV2: boolean): void {
+  builderParamsResult: BuilderParamsResult, log: LogInfo[], isReuseComponentInV2: boolean,
+  isArkoala: boolean = false): void {
   if (!partialUpdateConfig.partialUpdateMode) {
     const id: string = componentInfo.id.toString();
     newStatements.push(createFindChildById(id, name, isBuilder), createCustomComponentIfStatement(id,
@@ -338,7 +344,7 @@ function addCustomComponentStatements(node: ts.ExpressionStatement, newStatement
       ts.factory.createObjectLiteralExpression(props, true), name));
   } else {
     newStatements.push(createCustomComponent(newNode, name, componentNode, isGlobalBuilder, isBuilder,
-      isRecycleComponent, componentAttrInfo, builderParamsResult, log, isReuseComponentInV2));
+      isRecycleComponent, componentAttrInfo, builderParamsResult, log, isReuseComponentInV2, isArkoala));
   }
 }
 
@@ -579,7 +585,7 @@ function validateInitParam(childName: string, curChildProps: Set<string>,
 function createCustomComponent(newNode: ts.NewExpression, name: string, componentNode: ts.CallExpression,
   isGlobalBuilder: boolean, isBuilder: boolean, isRecycleComponent: boolean,
   componentAttrInfo: ComponentAttrInfo, builderParamsResult: BuilderParamsResult, log: LogInfo[], 
-  isReuseComponentInV2:boolean): ts.Block {
+  isReuseComponentInV2:boolean, isArkoala = false): ts.Block {
   let componentParameter: ts.ObjectLiteralExpression;
   if (componentNode.arguments && componentNode.arguments.length) {
     componentParameter = ts.factory.createObjectLiteralExpression(createChildElmtId(componentNode, name, log), true);
@@ -597,7 +603,7 @@ function createCustomComponent(newNode: ts.NewExpression, name: string, componen
   const arrowBolck: ts.Statement[] = [
     projectConfig.optLazyForEach && storedFileInfo.processLazyForEach ? createCollectElmtIdNode() : undefined,
     createIfCustomComponent(newNode, componentNode, componentParameter, name, isGlobalBuilder,
-      isBuilder, isRecycleComponent, componentAttrInfo, log)
+      isBuilder, isRecycleComponent, componentAttrInfo, log, isArkoala)
   ];
   if (isRecycleComponent) {
     arrowArgArr.push(ts.factory.createParameterDeclaration(
@@ -791,13 +797,142 @@ function splitComponentParams(componentNode: ts.CallExpression, isBuilder: boole
   return [keyArray, valueArray];
 }
 
+function createOptionsStatement(name: string) {
+  const optionsConstructorCall = ts.factory.createNewExpression(ts.factory.createIdentifier(name), undefined, []);
+  const optionsVariableDeclaration = ts.factory.createVariableDeclaration(
+    OPTIONS,
+    undefined,
+    undefined,
+    optionsConstructorCall
+  );
+  const variableDeclarationList = ts.factory.createVariableDeclarationList(
+    [optionsVariableDeclaration],
+    ts.NodeFlags.Let
+  );
+  return ts.factory.createVariableStatement(undefined, variableDeclarationList);
+}
+
+function createComponentCallStatement(name: string) {
+  const buildCompatibleNodeCall = ts.factory.createCallExpression(
+    ts.factory.createPropertyAccessExpression(ts.factory.createIdentifier(name), BUILDCOMPATIBLENODE),
+    undefined,
+    [ts.factory.createIdentifier(OPTIONS)]
+  );
+  const componentCallVariableDeclaration = ts.factory.createVariableDeclaration(
+    COMPONENT_CALL,
+    undefined,
+    undefined,
+    buildCompatibleNodeCall
+  );
+  const componentCallDeclarationList = ts.factory.createVariableDeclarationList(
+    [componentCallVariableDeclaration],
+    ts.NodeFlags.Let
+  );
+  return ts.factory.createVariableStatement(undefined, componentCallDeclarationList);
+}
+
+function createOptionsStatements(componentNode: ts.CallExpression, isBuilder: boolean): ts.Statement[] {
+  const isParamsLambda: boolean = true;
+  const [keyArray, valueArray]: [ts.Node[], ts.Node[]] = splitComponentParams(componentNode, isBuilder, isParamsLambda);
+  const statements: ts.Statement[] = [];
+  for (let i = 0; i < keyArray.length; i++) {
+    const key = keyArray[i];
+    const value = valueArray[i];
+
+    const propertyAccess = ts.factory.createPropertyAccessExpression(
+      ts.factory.createIdentifier(OPTIONS),
+      key as ts.Identifier
+    );
+
+    const assignmentStatement = ts.factory.createExpressionStatement(
+      ts.factory.createBinaryExpression(propertyAccess, ts.SyntaxKind.EqualsToken, value)
+    );
+
+    statements.push(assignmentStatement);
+  }
+  return statements;
+}
+
+function createStaticComponent(name: string, newNode: ts.NewExpression): ts.VariableStatement {
+  const argument = newNode.arguments;
+  const options = argument.length > 2 ? argument[1] : undefined;
+  console.log('lishihao: print arguments.length, ', argument.length);
+  printOriginNode(newNode);
+  return ts.factory.createVariableStatement(
+    undefined,
+    ts.factory.createVariableDeclarationList(
+      [
+        ts.factory.createVariableDeclaration(
+          ts.factory.createIdentifier('staticPointer'),
+          undefined,
+          undefined,
+          ts.factory.createCallExpression(
+            ts.factory.createIdentifier('createStaticComponent'),
+            undefined,
+            [
+              ts.factory.createArrowFunction(
+                undefined,
+                undefined,
+                [],
+                undefined,
+                ts.factory.createToken(ts.SyntaxKind.EqualsGreaterThanToken),
+                ts.factory.createBlock(
+                  [
+                    ts.factory.createReturnStatement(
+                      ts.factory.createNewExpression(
+                        ts.factory.createIdentifier(name),
+                        undefined,
+                        []
+                      )
+                    )
+                  ],
+                  false
+                )
+              ),
+              options
+            ]
+          )
+        )
+      ]
+    )
+  )
+}
+
+function pushStaticComponent(): ts.ExpressionStatement {
+  return ts.factory.createExpressionStatement(
+    ts.factory.createCallExpression(
+      ts.factory.createPropertyAccessExpression(
+        ts.factory.createIdentifier(VIEWSTACKPROCESSOR),
+        ts.factory.createIdentifier(PUSH)
+      ),
+      undefined,
+      [
+        ts.factory.createIdentifier('staticPointer')
+      ]
+    )
+  )
+}
+
 function createIfCustomComponent(newNode: ts.NewExpression, componentNode: ts.CallExpression,
   componentParameter: ts.ObjectLiteralExpression, name: string, isGlobalBuilder: boolean, isBuilder: boolean,
-  isRecycleComponent: boolean, componentAttrInfo: ComponentAttrInfo, log: LogInfo[]): ts.IfStatement {
+  isRecycleComponent: boolean, componentAttrInfo: ComponentAttrInfo, log: LogInfo[], isArkoala: boolean = false): ts.IfStatement {
+  if (isArkoala) {
+    return ts.factory.createIfStatement(
+      ts.factory.createIdentifier(ISINITIALRENDER),
+      ts.factory.createBlock(
+        [ 
+          createStaticComponent(name, newNode),
+          pushStaticComponent()
+        ], true),
+      ts.factory.createBlock(
+        []
+      )
+    )
+  }
   return ts.factory.createIfStatement(
     ts.factory.createIdentifier(ISINITIALRENDER),
     ts.factory.createBlock(
-      [componentParamDetachment(newNode, isRecycleComponent, name, log, componentNode),
+      [ componentParamDetachment(newNode, isRecycleComponent, name, log, componentNode),
         isRecycleComponent ? createNewRecycleComponent(newNode, componentNode, name, componentAttrInfo) :
           createNewComponent(COMPONENT_CALL, name, componentNode),
         assignComponentParams(componentNode, isBuilder),
@@ -1093,7 +1228,7 @@ function validateCustomComponentPrams(node: ts.CallExpression, name: string,
   validateInitParam(name, curChildProps, node, log, parentStructInfo);
 }
 
-function getCustomComponentNode(node: ts.ExpressionStatement): ts.CallExpression {
+export function getCustomComponentNode(node: ts.ExpressionStatement): ts.CallExpression {
   let temp: any = node.expression;
   let child: any = null;
   let componentNode: any = null;
diff --git a/compiler/src/interop/src/process_import.ts b/compiler/src/interop/src/process_import.ts
index 2eac04c5460ceffcfedfabd30e6ac66231acde02..e0b9a31bf535107b69c990223e85495dca35a599 100644
--- a/compiler/src/interop/src/process_import.ts
+++ b/compiler/src/interop/src/process_import.ts
@@ -90,6 +90,9 @@ import {
   validateModuleSpecifier
 } from './fast_build/system_api/api_check_utils';
 import processStructComponentV2, { StructInfo } from './process_struct_componentV2';
+import { ARKTS_1_2 } from './fast_build/ark_compiler/interop/pre_define';
+import { printOriginNode } from './ts_printer';
+import { FileManager } from './fast_build/ark_compiler/interop/interop_manager';
 
 const IMPORT_FILE_ASTCACHE: Map<string, ts.SourceFile> =
   process.env.watchMode === 'true' ? new Map() : (SOURCE_FILES || new Map());
@@ -306,12 +309,12 @@ function visitAllNode(node: ts.Node, sourceFile: ts.SourceFile, defaultNameFromP
         }
       });
     }
-    processImport(node, pagesDir, log, asNameFromParent, true, new Set(pathCollection));
+    processImport(node, pagesDir, log, undefined, asNameFromParent, true, new Set(pathCollection));
   }
   if (ts.isImportDeclaration(node)) {
     if (node.importClause && node.importClause.name && ts.isIdentifier(node.importClause.name) &&
       asNameFromParent.has(node.importClause.name.getText())) {
-      processImport(node, pagesDir, log, asNameFromParent, false, new Set(pathCollection));
+      processImport(node, pagesDir, log, undefined, asNameFromParent, false, new Set(pathCollection));
     } else if (node.importClause && node.importClause.namedBindings &&
       ts.isNamedImports(node.importClause.namedBindings) && node.importClause.namedBindings.elements) {
       let nested: boolean = false;
@@ -325,7 +328,7 @@ function visitAllNode(node: ts.Node, sourceFile: ts.SourceFile, defaultNameFromP
         }
       });
       if (nested) {
-        processImport(node, pagesDir, log, asNameFromParent, false, new Set(pathCollection));
+        processImport(node, pagesDir, log, undefined, asNameFromParent, false, new Set(pathCollection));
       }
     }
   }
@@ -788,6 +791,12 @@ export function processImportModule(node: ts.ImportDeclaration, pageFile: string
   }
 }
 
+function getFileVersion(originNode: ts.Node): string | undefined {
+  const fileName = originNode.getSourceFile().fileName;
+  const languageVersionversion = FileManager.getInstance().getLanguageVersionByFilePath(fileName);
+  return languageVersionversion?.languageVersion;
+}
+
 function getDefinedNode(importSymbol: ts.Symbol, realSymbol: ts.Symbol, originNode: ts.Node,
   usedNode: ts.Identifier, pageInfo: PageInfo, share: object = null): void {
   const checker: ts.TypeChecker | undefined = CurrentProcessFile.getChecker();
@@ -803,15 +812,18 @@ function getDefinedNode(importSymbol: ts.Symbol, realSymbol: ts.Symbol, originNo
     originNode = null;
   }
   if (originNode) {
+    printOriginNode(originNode);
     if (ts.isSourceFile(originNode) && realSymbol.escapedName) {
       const escapedName: string = realSymbol.escapedName.toString().replace(/^("|')/, '').replace(/("|')$/, '');
       if (fs.existsSync(escapedName + '.ets') || fs.existsSync(escapedName + '.ts') &&
         realSymbol.exports && realSymbol.exports instanceof Map) {
+        console.log('Warning: branch getIntegrationNodeInfo');
         getIntegrationNodeInfo(originNode, usedNode, realSymbol.exports, pageInfo, share);
         return;
       }
     }
-    processImportNode(originNode, usedNode, false, null, pageInfo, share);
+    const isArkoala = getFileVersion(originNode) === ARKTS_1_2;
+    processImportNode(originNode, usedNode, false, null, pageInfo, share, isArkoala);
   }
 }
 
@@ -857,7 +869,7 @@ function exportAllManage(originNode: ts.Node, usedNode: ts.Identifier, pageInfo:
 }
 
 function processImportNode(originNode: ts.Node, usedNode: ts.Identifier, importIntegration: boolean,
-  usedPropName: string, pageInfo: PageInfo, share: object = null): void {
+  usedPropName: string, pageInfo: PageInfo, share: object = null, isArkoala: boolean = false): void {
   const structDecorator: structDecoratorResult = { hasRecycle: false };
   let name: string;
   let asComponentName: string;
@@ -872,7 +884,7 @@ function processImportNode(originNode: ts.Node, usedNode: ts.Identifier, importI
   let needCollection: boolean = true;
   const originFile: string = originNode.getSourceFile() ? originNode.getSourceFile().fileName : undefined;
   if (ts.isStructDeclaration(originNode) && ts.isIdentifier(originNode.name)) {
-    parseComponentInImportNode(originNode, name, asComponentName, structDecorator, originFile);
+    parseComponentInImportNode(originNode, name, asComponentName, structDecorator, originFile, isArkoala);
   } else if (isObservedClass(originNode)) {
     observedClassCollection.add(name);
   } else if (ts.isFunctionDeclaration(originNode) && hasDecorator(originNode, COMPONENT_BUILDER_DECORATOR)) {
@@ -936,8 +948,12 @@ function setComponentCollectionInfo(name: string, componentSet: IComponentSet, i
 }
 
 function parseComponentInImportNode(originNode: ts.StructDeclaration, name: string,
-  asComponentName: string, structDecorator: structDecoratorResult, originFile: string): void {
-  componentCollection.customComponents.add(name);
+  asComponentName: string, structDecorator: structDecoratorResult, originFile: string, isArkoala: boolean = false): void {
+  if(!isArkoala) {
+    componentCollection.customComponents.add(name);
+  } else {
+    componentCollection.arkoalaComponents.add(name);
+  }
   const structInfo: StructInfo = asComponentName ?
     processStructComponentV2.getOrCreateStructInfo(asComponentName) :
     processStructComponentV2.getOrCreateStructInfo(name);
diff --git a/compiler/src/interop/src/process_ui_syntax.ts b/compiler/src/interop/src/process_ui_syntax.ts
index 16202d2dad2b88dd7634e683c28194317798f3ae..167afa3d2469a949ab66357d8bad36eb78951265 100644
--- a/compiler/src/interop/src/process_ui_syntax.ts
+++ b/compiler/src/interop/src/process_ui_syntax.ts
@@ -178,8 +178,44 @@ export let resourceFileName: string = '';
 export const builderTypeParameter: { params: string[] } = { params: [] };
 import parseIntent from './userIntents_parser/parseUserIntents';
 
-export function processUISyntax(program: ts.Program, ut = false,
-  parentEvent?: CompileEvent, filePath: string = '', share: object = null, metaInfo: Object = {}): Function {
+function generateExportStatements(): ts.Statement[] {
+  const statements: ts.Statement[] = [];
+  for (const name of componentCollection.arkoalaComponents) {
+    const optionsVariable = ts.factory.createVariableDeclaration(
+      ts.factory.createIdentifier(`__Options_${name}`),
+      undefined,
+      undefined,
+      ts.factory.createCallExpression(
+        ts.factory.createPropertyAccessExpression(
+          ts.factory.createAsExpression(
+            ts.factory.createIdentifier("globalThis"),
+            ts.factory.createKeywordTypeNode(ts.SyntaxKind.AnyKeyword)
+          ),
+          ts.factory.createIdentifier("Panda.getClass")
+        ),
+        undefined,
+        [ts.factory.createStringLiteral(`har_2/__Options_${name}`)]
+      )
+    );
+
+    const optionsVariableStatement = ts.factory.createVariableStatement(
+      [ts.factory.createToken(ts.SyntaxKind.ExportKeyword)],
+      ts.factory.createVariableDeclarationList([optionsVariable], ts.NodeFlags.Const)
+    );
+
+    statements.push(optionsVariableStatement);
+  }
+  return statements;
+}
+
+function insertExportsAtTop(sourceFile: ts.SourceFile): ts.SourceFile {
+  const exportStatements = generateExportStatements();
+  const newStatements = [...exportStatements, ...sourceFile.statements];
+  return ts.factory.updateSourceFile(sourceFile, newStatements);
+}
+
+export function processUISyntax(program: ts.Program, ut = false, parentEvent?: CompileEvent,
+  filePath: string = '', share: object = null, metaInfo: Object = {}): Function {
   let entryNodeKey: ts.Expression;
   let eventProcessUISyntax: CompileEvent = undefined;
   return (context: ts.TransformationContext) => {
@@ -220,7 +256,10 @@ export function processUISyntax(program: ts.Program, ut = false,
           return visitEachChildNode;
         }
         const id: number = ++componentInfo.id;
+        // node = ts.visitEachChild(node, processAllNodes, context);
+        console.log('lishihao:processAllNodes visitEachChild');
         node = ts.visitEachChild(node, processAllNodes, context);
+        node = insertExportsAtTop(node);
         if (context.getCompilerOptions().etsAnnotationsEnable) {
           node = ts.getAnnotationTransformer()(context)(node);
         }
diff --git a/compiler/src/interop/src/ts_printer.ts b/compiler/src/interop/src/ts_printer.ts
new file mode 100644
index 0000000000000000000000000000000000000000..e427c521613d0a536f0f106558506025cf0c071c
--- /dev/null
+++ b/compiler/src/interop/src/ts_printer.ts
@@ -0,0 +1,45 @@
+import * as ts from "typescript";
+
+// 假设在 getDefinedNode 函数中获取到 originNode 后，调用此方法打印
+export function printOriginNode(originNode: ts.Node | null) {
+  if (!originNode) {
+    console.log("originNode 为 null（未找到定义）");
+    return;
+  }
+
+  // 1. 打印节点对应的代码文本（使用 ts.createPrinter）
+  const sourceFile = originNode.getSourceFile(); // 获取节点所在的源文件
+  const printer = ts.createPrinter({ newLine: ts.NewLineKind.LineFeed });
+  const nodeCode = printer.printNode(ts.EmitHint.Unspecified, originNode, sourceFile);
+  console.log("=== originNode 对应的代码 ===");
+  console.log(nodeCode);
+
+  // 2. 打印节点的基本信息（类型、位置等）
+  const nodeKind = ts.SyntaxKind[originNode.kind]; // 节点类型名称
+  const position = sourceFile.getLineAndCharacterOfPosition(originNode.pos); // 位置
+  console.log("\n=== originNode 基本信息 ===");
+  console.log(`节点类型：${nodeKind}`);
+  console.log(`所在文件：${sourceFile.fileName}`);
+  console.log(`位置：行 ${position.line + 1}, 列 ${position.character + 1}`);
+
+  // 3. 打印节点的关键属性（根据节点类型自定义）
+  console.log("\n=== originNode 关键属性 ===");
+  switch (originNode.kind) {
+    case ts.SyntaxKind.VariableDeclaration:
+      const varNode = originNode as ts.VariableDeclaration;
+      console.log(`变量名：${(varNode.name as ts.Identifier).text}`);
+      console.log(`初始值：${varNode.initializer ? printer.printNode(ts.EmitHint.Unspecified, varNode.initializer, sourceFile) : "无"}`);
+      break;
+    case ts.SyntaxKind.FunctionDeclaration:
+      const funcNode = originNode as ts.FunctionDeclaration;
+      console.log(`函数名：${funcNode.name?.text}`);
+      console.log(`参数数量：${funcNode.parameters.length}`);
+      break;
+    // 可根据需要扩展其他节点类型
+    default:
+      console.log(`节点类型 ${nodeKind} 的属性未定义打印逻辑`);
+  }
+}
+
+// 使用示例（在 getDefinedNode 函数末尾调用）
+// printOriginNode(originNode);
diff --git a/compiler/src/interop/src/validate_ui_syntax.ts b/compiler/src/interop/src/validate_ui_syntax.ts
index 4543facef4b2604fbb20bde25fc1d33235c17ac2..9fcf9a9008380316c2b711ec6757ba4adf28749a 100644
--- a/compiler/src/interop/src/validate_ui_syntax.ts
+++ b/compiler/src/interop/src/validate_ui_syntax.ts
@@ -125,6 +125,7 @@ export class ComponentCollection {
   previewComponent: Array<string> = [];
   customDialogs: Set<string> = new Set([]);
   customComponents: Set<string> = new Set([]);
+  arkoalaComponents: Set<string> = new Set([]);
   currentClassName: string = null;
 }