async import page component

src/router/index.ts

@@ -1,6 +1,3 @@
-import IndexLayout from "@/layout/IndexLayout.vue";
-import RepositoryList from "@/views/index/RepositoryList.vue";
-import RepositoryLog from "@/views/index/RepositoryLog.vue";
 import { createRouter, createWebHistory } from "vue-router";
 import repository from "./repository";
 
@@ -11,17 +8,22 @@ export default createRouter({
 			// 主路由
 			path: "/",
 			name: "IndexLayout",
-			component: IndexLayout,
+			component:  () => import("@/layout/IndexLayout.vue"),
 			children: [
 				{
 					path: "/",
 					name: "RepositoryList",
-					component: RepositoryList
+					component:  () => import("@/views/index/RepositoryList.vue")
 				},
 				{
 					path: "/log",
 					name: "RepositoryLog",
-					component: RepositoryLog
+					component:  () => import("@/views/index/RepositoryLog.vue")
+				},
+				{
+					path: "/about",
+					name: "About",
+					component:  () => import("@/views/index/About.vue")
 				}
 			]
 		},

src/router/repository.ts

@@ -1,23 +1,12 @@
-import RepositoryLayout from "@/layout/RepositoryLayout.vue";
-import CommitLog from "@/views/repository/CommitLog.vue";
-import FileDetail from "@/views/repository/FileDetail.vue";
-import IssueDetail from "@/views/repository/IssueDetail.vue";
-import IssueEdit from "@/views/repository/IssueEdit.vue";
-import IssueList from "@/views/repository/IssueList.vue";
-import MergeDetail from "@/views/repository/MergeDetail.vue";
-import MergeEdit from "@/views/repository/MergeEdit.vue";
-import MergeList from "@/views/repository/MergeList.vue";
-import ReleaseList from "@/views/repository/ReleaseList.vue";
-
 export default {
 	path: "/:repository",
 	name: "RepositoryLayout",
-	component: RepositoryLayout,
+	component:  () => import("@/layout/RepositoryLayout.vue"),
 	children: [
 		{
 			path: ":branch",
 			name: "FileDetail",
-			component: FileDetail,
+			component:  () => import("@/views/repository/FileDetail.vue"),
 			meta: {
 				keepAlive: true
 			}
@@ -25,47 +14,42 @@ export default {
 		{
 			path: "commits",
 			name: "CommitLog",
-			component: CommitLog
+			component:  () => import("@/views/repository/CommitLog.vue")
 		},
 		{
 			path: "issues",
 			name: "IssueList",
-			component: IssueList
-		},
-		{
-			path: "issues",
-			name: "IssueList",
-			component: IssueList
+			component:  () => import("@/views/repository/IssueList.vue")
 		},
 		{
 			path: "issues/edit/:id?",
 			name: "IssueEdit",
-			component: IssueEdit
+			component:  () => import("@/views/repository/IssueEdit.vue")
 		},
 		{
 			path: "issues/:id",
 			name: "IssueDetail",
-			component: IssueDetail
+			component:  () => import("@/views/repository/IssueDetail.vue")
 		},
 		{
 			path: "merges",
 			name: "MergeList",
-			component: MergeList
+			component:  () => import("@/views/repository/MergeList.vue")
 		},
 		{
 			path: "merges/edit/:id?",
 			name: "MergeEdit",
-			component: MergeEdit
+			component:  () => import("@/views/repository/MergeEdit.vue")
 		},
 		{
 			path: "merges/:id",
 			name: "MergeDetail",
-			component: MergeDetail
+			component:  () => import("@/views/repository/MergeDetail.vue")
 		},
 		{
 			path: "releases",
 			name: "ReleaseList",
-			component: ReleaseList
+			component:  () => import("@/views/repository/ReleaseList.vue")
 		}
 	]
 };