From e8b6e165bdd9dd9446ef3617ae007413577d8603 Mon Sep 17 00:00:00 2001
From: lanyuanxiaoyao <lanyuanxiaoyao@gmail.com>
Date: Wed, 11 Dec 2024 17:42:32 +0800
Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0vue-router=E6=9D=A5=E6=8E=A7?=
 =?UTF-8?q?=E5=88=B6=E9=A1=B5=E9=9D=A2=E6=98=BE=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json        |  3 ++-
 pnpm-lock.yaml      | 18 ++++++++++++++++++
 src/App.vue         | 11 +----------
 src/main.ts         |  7 ++++---
 src/router/index.ts | 27 +++++++++++++++++++++++++++
 5 files changed, 52 insertions(+), 14 deletions(-)
 create mode 100644 src/router/index.ts

diff --git a/package.json b/package.json
index f2e8d40..7e615aa 100644
--- a/package.json
+++ b/package.json
@@ -9,7 +9,8 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "vue": "^3.5.13"
+    "vue": "^3.5.13",
+    "vue-router": "4"
   },
   "devDependencies": {
     "@types/node": "^22.10.1",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 27d184d..1f56845 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -11,6 +11,9 @@ importers:
       vue:
         specifier: ^3.5.13
         version: 3.5.13(typescript@5.7.2)
+      vue-router:
+        specifier: '4'
+        version: 4.5.0(vue@3.5.13(typescript@5.7.2))
     devDependencies:
       '@types/node':
         specifier: ^22.10.1
@@ -317,6 +320,9 @@ packages:
   '@vue/compiler-ssr@3.5.13':
     resolution: {integrity: sha512-wMH6vrYHxQl/IybKJagqbquvxpWCuVYpoUJfCqFZwa/JY1GdATAQ+TgVtgrwwMZ0D07QhA99rs/EAAWfvG6KpA==, tarball: https://registry.npmjs.org/@vue/compiler-ssr/-/compiler-ssr-3.5.13.tgz}
 
+  '@vue/devtools-api@6.6.4':
+    resolution: {integrity: sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g==, tarball: https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.6.4.tgz}
+
   '@vue/reactivity@3.5.13':
     resolution: {integrity: sha512-NaCwtw8o48B9I6L1zl2p41OHo/2Z4wqYGGIK1Khu5T7yxrn+ATOixn/Udn2m+6kZKB/J7cuT9DbWWhRxqixACg==, tarball: https://registry.npmjs.org/@vue/reactivity/-/reactivity-3.5.13.tgz}
 
@@ -585,6 +591,11 @@ packages:
       yaml:
         optional: true
 
+  vue-router@4.5.0:
+    resolution: {integrity: sha512-HDuk+PuH5monfNuY+ct49mNmkCRK4xJAV9Ts4z9UFc4rzdDnxQLyCMGGc8pKhZhHTVzfanpNwB/lwqevcBwI4w==, tarball: https://registry.npmjs.org/vue-router/-/vue-router-4.5.0.tgz}
+    peerDependencies:
+      vue: ^3.2.0
+
   vue@3.5.13:
     resolution: {integrity: sha512-wmeiSMxkZCSc+PM2w2VRsOYAZC8GdipNFRTsLSfodVqI9mbejKeXEGr8SckuLnrQPGe3oJN5c3K0vpoU9q/wCQ==, tarball: https://registry.npmjs.org/vue/-/vue-3.5.13.tgz}
     peerDependencies:
@@ -782,6 +793,8 @@ snapshots:
       '@vue/compiler-dom': 3.5.13
       '@vue/shared': 3.5.13
 
+  '@vue/devtools-api@6.6.4': {}
+
   '@vue/reactivity@3.5.13':
     dependencies:
       '@vue/shared': 3.5.13
@@ -1015,6 +1028,11 @@ snapshots:
       fsevents: 2.3.3
       sass-embedded: 1.82.0
 
+  vue-router@4.5.0(vue@3.5.13(typescript@5.7.2)):
+    dependencies:
+      '@vue/devtools-api': 6.6.4
+      vue: 3.5.13(typescript@5.7.2)
+
   vue@3.5.13(typescript@5.7.2):
     dependencies:
       '@vue/compiler-dom': 3.5.13
diff --git a/src/App.vue b/src/App.vue
index 42d20e0..98240ae 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,12 +1,3 @@
-<script setup lang="ts">
-import { ref } from 'vue'
-import Config from './pages/Config.vue'
-import Project from './pages/Project.vue'
-
-const showConfig = ref(false)
-</script>
-
 <template>
-  <Config v-if="showConfig" />
-  <Project v-else />
+  <router-view />
 </template>
diff --git a/src/main.ts b/src/main.ts
index ce4dd6b..55a12eb 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,7 +1,8 @@
 import { createApp } from 'vue'
-import './style.css'
-import type { App as AppType } from 'vue'
 import App from './App.vue'
+import router from './router'
+import './style.css'
 
-const app: AppType = createApp(App)
+const app = createApp(App)
+app.use(router)
 app.mount('#app')
diff --git a/src/router/index.ts b/src/router/index.ts
new file mode 100644
index 0000000..8e215b0
--- /dev/null
+++ b/src/router/index.ts
@@ -0,0 +1,27 @@
+import { createWebHashHistory } from 'vue-router'
+import { createRouter } from 'vue-router'
+import type { RouteRecordRaw } from 'vue-router'
+
+const routes: RouteRecordRaw[] = [
+  {
+    path: '/',
+    redirect: '/project'
+  },
+  {
+    path: '/project',
+    name: 'project',
+    component: () => import('@/pages/Project.vue')
+  },
+  {
+    path: '/config',
+    name: 'config',
+    component: () => import('@/pages/Config.vue')
+  }
+]
+
+const router = createRouter({
+  history: createWebHashHistory(),
+  routes
+})
+
+export default router 
\ No newline at end of file