diff --git a/src/admin/problem/detail.vue b/src/admin/problem/detail.vue
index 9f86662..c766062 100644
--- a/src/admin/problem/detail.vue
+++ b/src/admin/problem/detail.vue
@@ -1,6 +1,5 @@
 <script setup lang="ts">
 import TextEditor from "~/shared/TextEditor.vue"
-import Monaco from "~/shared/Monaco.vue"
 
 import { SelectOption, UploadCustomRequestOptions } from "naive-ui"
 import { unique } from "~/utils/functions"
@@ -17,6 +16,8 @@ import {
   uploadTestcases,
 } from "../api"
 
+const Monaco = defineAsyncComponent(() => import("~/shared/Monaco.vue"))
+
 interface Props {
   problemID?: string
   contestID?: string
diff --git a/src/learn/index.vue b/src/learn/index.vue
index feed0c0..6a8e119 100644
--- a/src/learn/index.vue
+++ b/src/learn/index.vue
@@ -1,8 +1,9 @@
 <script setup lang="ts">
-import Monaco from "~/shared/Monaco.vue"
 import { isDesktop } from "~/shared/composables/breakpoints"
 import { code } from "~/shared/composables/learn"
 
+const Monaco = defineAsyncComponent(() => import("~/shared/Monaco.vue"))
+
 const route = useRoute()
 const router = useRouter()
 
diff --git a/src/oj/problem/components/Editor.vue b/src/oj/problem/components/Editor.vue
index df36316..a77745c 100644
--- a/src/oj/problem/components/Editor.vue
+++ b/src/oj/problem/components/Editor.vue
@@ -1,11 +1,12 @@
 <script lang="ts" setup>
 import { SOURCES } from "utils/constants"
 import { Problem } from "utils/types"
-import Monaco from "~/shared/Monaco.vue"
 import { code } from "oj/composables/code"
 import { isDesktop } from "~/shared/composables/breakpoints"
 import Form from "./Form.vue"
 
+const Monaco = defineAsyncComponent(() => import("~/shared/Monaco.vue"))
+
 interface Props {
   problem: Problem
 }