diff --git a/compiler/test/ut/import/importAllEts.ts b/compiler/test/ut/import/importAllEts.ts
index fc7a23c..17441fd 100644
--- a/compiler/test/ut/import/importAllEts.ts
+++ b/compiler/test/ut/import/importAllEts.ts
@@ -49,12 +49,36 @@ struct ImportTest {
 `
 
 exports.expectResult =
-`import * as AllComponent from './test/pages/NamespaceComponent';
-import TsModule from './test/pages/TsModule';
+`"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const AllComponent = __importStar(require("./test/pages/NamespaceComponent"));
+const TsModule_1 = __importDefault(require("./test/pages/TsModule"));
 class ImportTest extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
-        this.__myState1 = new ObservedPropertyObject(new TsModule(1).method(), this, "myState1");
+        this.__myState1 = new ObservedPropertyObject(new TsModule_1.default(1).method(), this, "myState1");
         this.__myState2 = new ObservedPropertySimple(0, this, "myState2");
         this.__myState3 = new ObservedPropertySimple(false, this, "myState3");
         this.__myState4 = new ObservedPropertySimple('ImportTest', this, "myState4");
diff --git a/compiler/test/ut/import/importEts.ts b/compiler/test/ut/import/importEts.ts
index 9536544..f57ba18 100644
--- a/compiler/test/ut/import/importEts.ts
+++ b/compiler/test/ut/import/importEts.ts
@@ -21,7 +21,7 @@ LinkComponentDefault, {
   LinkComponent3
 } from './test/pages/LinkComponent'
 import DefaultComponent from "./test/pages/DefaultComponent"
-import AMDComponentDefault from "./test/pages/AMDComponent"
+import AMDComponentDefault = require('./test/pages/AMDComponent')
 import TsModule from './test/pages/TsModule'
 
 @Entry
@@ -99,14 +99,38 @@ struct ImportTest {
 `
 
 exports.expectResult =
-`import LinkComponentDefault, { LinkComponent as LinkComponent1Ref, LinkComponent2 as LinkComponent2Ref, LinkComponent3 } from './test/pages/LinkComponent';
-import DefaultComponent from "./test/pages/DefaultComponent";
-import AMDComponentDefault from "./test/pages/AMDComponent";
-import TsModule from './test/pages/TsModule';
+`"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const LinkComponent_1 = __importStar(require("./test/pages/LinkComponent"));
+const DefaultComponent_1 = __importDefault(require("./test/pages/DefaultComponent"));
+const AMDComponentDefault = require("./test/pages/AMDComponent");
+const TsModule_1 = __importDefault(require("./test/pages/TsModule"));
 class ImportTest extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
-        this.__myState1 = new ObservedPropertyObject(new TsModule(1).method(), this, "myState1");
+        this.__myState1 = new ObservedPropertyObject(new TsModule_1.default(1).method(), this, "myState1");
         this.__myState2 = new ObservedPropertySimple(0, this, "myState2");
         this.__myState3 = new ObservedPropertySimple(false, this, "myState3");
         this.__myState4 = new ObservedPropertySimple('ImportTest', this, "myState4");
@@ -161,7 +185,7 @@ class ImportTest extends View {
         Column.create();
         let earlierCreatedChild_2 = this.findChildById("2");
         if (earlierCreatedChild_2 == undefined) {
-            View.create(new LinkComponent2Ref("2", this, {
+            View.create(new LinkComponent_1.LinkComponent2("2", this, {
                 LinkComponent2Link1: this.__myState1,
                 LinkComponent2Link2: this.__myState2,
                 LinkComponent2Link3: this.__myState3,
@@ -187,7 +211,7 @@ class ImportTest extends View {
         Text.pop();
         let earlierCreatedChild_3 = this.findChildById("3");
         if (earlierCreatedChild_3 == undefined) {
-            View.create(new LinkComponent1Ref("3", this, {
+            View.create(new LinkComponent_1.LinkComponent("3", this, {
                 LinkComponent1Link1: this.__myState1,
                 LinkComponent1Link2: this.__myState2,
                 LinkComponent1Link3: this.__myState3,
@@ -209,7 +233,7 @@ class ImportTest extends View {
         }
         let earlierCreatedChild_4 = this.findChildById("4");
         if (earlierCreatedChild_4 == undefined) {
-            View.create(new DefaultComponent("4", this, {
+            View.create(new DefaultComponent_1.default("4", this, {
                 DefaultComponentLink1: this.__myState1,
                 DefaultComponentLink2: this.__myState2,
                 DefaultComponentLink3: this.__myState3,
@@ -227,7 +251,7 @@ class ImportTest extends View {
         }
         let earlierCreatedChild_5 = this.findChildById("5");
         if (earlierCreatedChild_5 == undefined) {
-            View.create(new LinkComponentDefault("5", this, {
+            View.create(new LinkComponent_1.default("5", this, {
                 LinkComponent3Link1: this.__myState1,
                 LinkComponent3Link2: this.__myState2,
                 LinkComponent3Link3: this.__myState3,
@@ -267,7 +291,7 @@ class ImportTest extends View {
         }
         let earlierCreatedChild_7 = this.findChildById("7");
         if (earlierCreatedChild_7 == undefined) {
-            View.create(new LinkComponent3("7", this, {
+            View.create(new LinkComponent_1.LinkComponent3("7", this, {
                 LinkComponent3Link1: this.__myState1,
                 LinkComponent3Link2: this.__myState2,
                 LinkComponent3Link3: this.__myState3,
diff --git a/compiler/test/ut/import/importExportEts.ts b/compiler/test/ut/import/importExportEts.ts
index 8b11bb5..652a822 100644
--- a/compiler/test/ut/import/importExportEts.ts
+++ b/compiler/test/ut/import/importExportEts.ts
@@ -53,12 +53,17 @@ struct ImportTest {
 `
 
 exports.expectResult =
-`import { AllStarComponent } from './test/pages/ExportStarComponent';
-import TsModule from './test/pages/TsModule';
+`"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const ExportStarComponent_1 = require("./test/pages/ExportStarComponent");
+const TsModule_1 = __importDefault(require("./test/pages/TsModule"));
 class ImportTest extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
-        this.__myState1 = new ObservedPropertyObject(new TsModule(1).method(), this, "myState1");
+        this.__myState1 = new ObservedPropertyObject(new TsModule_1.default(1).method(), this, "myState1");
         this.__myState2 = new ObservedPropertySimple(0, this, "myState2");
         this.__myState3 = new ObservedPropertySimple(false, this, "myState3");
         this.__myState4 = new ObservedPropertySimple('ImportTest', this, "myState4");
@@ -113,7 +118,7 @@ class ImportTest extends View {
         Column.create();
         let earlierCreatedChild_2 = this.findChildById("2");
         if (earlierCreatedChild_2 == undefined) {
-            View.create(new AllStarComponent.ExportComponent("2", this, {
+            View.create(new ExportStarComponent_1.AllStarComponent.ExportComponent("2", this, {
                 ExportComponent1Link1: this.__myState1,
                 ExportComponent1Link2: this.__myState2,
                 ExportComponent1Link3: this.__myState3,
@@ -135,7 +140,7 @@ class ImportTest extends View {
         }
         let earlierCreatedChild_3 = this.findChildById("3");
         if (earlierCreatedChild_3 == undefined) {
-            View.create(new AllStarComponent.default("3", this, {
+            View.create(new ExportStarComponent_1.AllStarComponent.default("3", this, {
                 ExportComponent4Link1: this.__myState1,
                 ExportComponent4Link2: this.__myState2,
                 ExportComponent4Link3: this.__myState3,
diff --git a/compiler/test/ut/import/importTs.ts b/compiler/test/ut/import/importTs.ts
index 40570ff..ad5e964 100644
--- a/compiler/test/ut/import/importTs.ts
+++ b/compiler/test/ut/import/importTs.ts
@@ -53,12 +53,17 @@ struct ImportTest {
 `
 
 exports.expectResult =
-`import { AllStarComponent } from './test/pages/ExportStarComponent';
-import TsModule from './test/pages/TsModule';
+`"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const ExportStarComponent_1 = require("./test/pages/ExportStarComponent");
+const TsModule_1 = __importDefault(require("./test/pages/TsModule"));
 class ImportTest extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
-        this.__myState1 = new ObservedPropertyObject(new TsModule(1).method(), this, "myState1");
+        this.__myState1 = new ObservedPropertyObject(new TsModule_1.default(1).method(), this, "myState1");
         this.__myState2 = new ObservedPropertySimple(0, this, "myState2");
         this.__myState3 = new ObservedPropertySimple(false, this, "myState3");
         this.__myState4 = new ObservedPropertySimple('ImportTest', this, "myState4");
@@ -113,7 +118,7 @@ class ImportTest extends View {
         Column.create();
         let earlierCreatedChild_2 = this.findChildById("2");
         if (earlierCreatedChild_2 == undefined) {
-            View.create(new AllStarComponent.ExportComponent("2", this, {
+            View.create(new ExportStarComponent_1.AllStarComponent.ExportComponent("2", this, {
                 ExportComponent1Link1: this.__myState1,
                 ExportComponent1Link2: this.__myState2,
                 ExportComponent1Link3: this.__myState3,
@@ -135,7 +140,7 @@ class ImportTest extends View {
         }
         let earlierCreatedChild_3 = this.findChildById("3");
         if (earlierCreatedChild_3 == undefined) {
-            View.create(new AllStarComponent.default("3", this, {
+            View.create(new ExportStarComponent_1.AllStarComponent.default("3", this, {
                 ExportComponent4Link1: this.__myState1,
                 ExportComponent4Link2: this.__myState2,
                 ExportComponent4Link3: this.__myState3,
diff --git a/compiler/test/ut/inner_commponent_transform/render_component/if/if.ts b/compiler/test/ut/inner_commponent_transform/render_component/if/if.ts
index 539115c..16dda28 100644
--- a/compiler/test/ut/inner_commponent_transform/render_component/if/if.ts
+++ b/compiler/test/ut/inner_commponent_transform/render_component/if/if.ts
@@ -52,8 +52,10 @@ struct MyComponent {
 `
 
 exports.expectResult =
-`import { TestComponent } from './test/pages/TestComponent';
-import { Animal } from './test/pages/TsModule';
+`"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const TestComponent_1 = require("./test/pages/TestComponent");
+const TsModule_1 = require("./test/pages/TsModule");
 class MyComponent extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
@@ -108,11 +110,11 @@ class MyComponent extends View {
         }
         If.pop();
         If.create();
-        if (Animal.Dog) {
+        if (TsModule_1.Animal.Dog) {
             If.branchId(0);
             let earlierCreatedChild_2 = this.findChildById("2");
             if (earlierCreatedChild_2 == undefined) {
-                View.create(new TestComponent("2", this, { content: 'if (import enum)' }));
+                View.create(new TestComponent_1.TestComponent("2", this, { content: 'if (import enum)' }));
             }
             else {
                 earlierCreatedChild_2.updateWithValueParams({
diff --git a/compiler/test/ut/render_decorator/@builderParam/@builderParam.ts b/compiler/test/ut/render_decorator/@builderParam/@builderParam.ts
index fa65ee6..edff8d5 100644
--- a/compiler/test/ut/render_decorator/@builderParam/@builderParam.ts
+++ b/compiler/test/ut/render_decorator/@builderParam/@builderParam.ts
@@ -94,7 +94,9 @@ struct CustomContainerUser {
 }
 `
 exports.expectResult =
-`import { CustomContainerExport } from './test/pages/TestComponent';
+`"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const TestComponent_1 = require("./test/pages/TestComponent");
 class CustomContainer extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
@@ -191,7 +193,7 @@ class CustomContainerUser extends View {
         Column.create();
         let earlierCreatedChild_2 = this.findChildById("2");
         if (earlierCreatedChild_2 == undefined) {
-            View.create(new CustomContainerExport("2", this, {
+            View.create(new TestComponent_1.CustomContainerExport("2", this, {
                 header: this.text,
                 closer: () => {
                     Column.create();
diff --git a/compiler/test/ut/render_decorator/@styles/@stylesExport.ts b/compiler/test/ut/render_decorator/@styles/@stylesExport.ts
index 45d3e8a..df32684 100644
--- a/compiler/test/ut/render_decorator/@styles/@stylesExport.ts
+++ b/compiler/test/ut/render_decorator/@styles/@stylesExport.ts
@@ -55,7 +55,10 @@ export struct FancyUseExp {
 `
 
 exports.expectResult =
-`export class FancyUseExp extends View {
+`"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.FancyUseExp = void 0;
+class FancyUseExp extends View {
     constructor(compilerAssignedUniqueChildId, parent, params) {
         super(compilerAssignedUniqueChildId, parent);
         this.__enable = new ObservedPropertySimple(true, this, "enable");
@@ -106,5 +109,6 @@ exports.expectResult =
         Column.pop();
     }
 }
+exports.FancyUseExp = FancyUseExp;
 loadDocument(new FancyUseExp("1", undefined, {}));
 `
diff --git a/compiler/tsconfig.cjs.json b/compiler/tsconfig.esm.json
similarity index 99%
rename from compiler/tsconfig.cjs.json
rename to compiler/tsconfig.esm.json
index 09ad1cd..b37d725 100644
--- a/compiler/tsconfig.cjs.json
+++ b/compiler/tsconfig.esm.json
@@ -557,7 +557,7 @@
     "resolveJsonModule": true,
     "skipLibCheck": true,
     "sourceMap": true,
-    "module": "commonjs",
+    "module": "es2020",
     "target": "es2017",
     "types": [],
     "typeRoots": [],
diff --git a/compiler/tsconfig.json b/compiler/tsconfig.json
index b37d725..09ad1cd 100644
--- a/compiler/tsconfig.json
+++ b/compiler/tsconfig.json
@@ -557,7 +557,7 @@
     "resolveJsonModule": true,
     "skipLibCheck": true,
     "sourceMap": true,
-    "module": "es2020",
+    "module": "commonjs",
     "target": "es2017",
     "types": [],
     "typeRoots": [],