diff --git a/src/router/index.ts b/src/router/index.ts
index a325937..c277011 100644
--- a/src/router/index.ts
+++ b/src/router/index.ts
@@ -1,3 +1,6 @@
+import IndexLayout from "@/layout/IndexLayout.vue";
+import ArticleDetail from "@/views/ArticleDetail.vue";
+import ArticleIndex from "@/views/ArticleIndex.vue";
 import { createRouter, createWebHistory } from "vue-router";
 
 export default createRouter({
@@ -6,22 +9,22 @@ export default createRouter({
 		{
 			path: "/",
 			name: "Index",
-			component: () => import("@/layout/IndexLayout.vue"),
+			component: IndexLayout,
 			children: [
 				{
 					path: "/",
 					name: "ArticleIndex",
-					component: () => import("@/views/ArticleIndex.vue")
+					component: ArticleIndex
 				},
 				{
 					path: "/aid:id.html",
 					name: "ArticleDetail",
-					component: () => import("@/views/ArticleDetail.vue")
+					component: ArticleDetail
 				},
 				{
 					path: "/about",
 					name: "About",
-					component: () => import("@/views/ArticleDetail.vue")
+					component: ArticleDetail
 				}
 			]
 		}
diff --git a/src/views/ArticleDetail.vue b/src/views/ArticleDetail.vue
index 31bc7ae..cf399a8 100644
--- a/src/views/ArticleDetail.vue
+++ b/src/views/ArticleDetail.vue
@@ -38,6 +38,10 @@
 
 <script lang="ts" setup>
 import { ArticleAPI, ArticleView, Icon } from "timi-web";
+import ArticleAbout from "@/components/article/template/ArticleAbout.vue";
+import ArticleMusic from "@/components/article/template/ArticleMusic.vue";
+import ArticlePublic from "@/components/article/template/ArticlePublic.vue";
+import ArticleSoftware from "@/components/article/template/ArticleSoftware.vue";
 import { type Component } from "vue";
 
 const route = useRoute();
@@ -45,20 +49,19 @@ const router = useRouter();
 
 const article = ref<ArticleView<any>>();
 const template = ref<Component | null>(null);
-const templates: Record<string, () => Promise<Component>> = {
-	ABOUT: () => import("@/components/article/template/ArticleAbout.vue"),
-	MUSIC: () => import("@/components/article/template/ArticleMusic.vue"),
-	PUBLIC: () => import("@/components/article/template/ArticlePublic.vue"),
-	SOFTWARE: () => import("@/components/article/template/ArticleSoftware.vue")
+const templates: Record<string, Component> = {
+	ABOUT: ArticleAbout,
+	MUSIC: ArticleMusic,
+	PUBLIC: ArticlePublic,
+	SOFTWARE: ArticleSoftware
 };
 const isAboutRoute = computed(() => route.name === "About");
 
 watch(article, () => {
-	if (!article.value) {
-		return;
+	if (article.value) {
+		const key = isAboutRoute.value ? "ABOUT" : article.value.type;
+		template.value = markRaw(templates[key]);
 	}
-	const loader = templates[isAboutRoute.value ? "ABOUT" : article.value.type];
-	template.value = defineAsyncComponent(loader);
 });
 
 onMounted(async () => {