diff --git a/.nvmrc b/.nvmrc
new file mode 100644
index 0000000..8fdd954
--- /dev/null
+++ b/.nvmrc
@@ -0,0 +1 @@
+22
\ No newline at end of file
diff --git a/package.json b/package.json
index 04b3237..7f1f769 100644
--- a/package.json
+++ b/package.json
@@ -11,7 +11,8 @@
   "dependencies": {
     "element-plus": "^2.8.1",
     "vue": "^3.4.37",
-    "vue-i18n": "^9.14.0"
+    "vue-i18n": "^9.14.0",
+    "vue-router": "^4.4.3"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^5.1.2",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 5999454..0355be7 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -17,6 +17,9 @@ importers:
       vue-i18n:
         specifier: ^9.14.0
         version: 9.14.0(vue@3.5.2(typescript@5.5.4))
+      vue-router:
+        specifier: ^4.4.3
+        version: 4.4.3(vue@3.5.2(typescript@5.5.4))
     devDependencies:
       '@vitejs/plugin-vue':
         specifier: ^5.1.2
@@ -752,6 +755,11 @@ packages:
     peerDependencies:
       vue: ^3.0.0
 
+  vue-router@4.4.3:
+    resolution: {integrity: sha512-sv6wmNKx2j3aqJQDMxLFzs/u/mjA9Z5LCgy6BE0f7yFWMjrPLnS/sPNn8ARY/FXw6byV18EFutn5lTO6+UsV5A==}
+    peerDependencies:
+      vue: ^3.2.0
+
   vue-tsc@2.1.6:
     resolution: {integrity: sha512-f98dyZp5FOukcYmbFpuSCJ4Z0vHSOSmxGttZJCsFeX0M4w/Rsq0s4uKXjcSRsZqsRgQa6z7SfuO+y0HVICE57Q==}
     hasBin: true
@@ -1426,6 +1434,11 @@ snapshots:
       '@vue/devtools-api': 6.6.3
       vue: 3.5.2(typescript@5.5.4)
 
+  vue-router@4.4.3(vue@3.5.2(typescript@5.5.4)):
+    dependencies:
+      '@vue/devtools-api': 6.6.3
+      vue: 3.5.2(typescript@5.5.4)
+
   vue-tsc@2.1.6(typescript@5.5.4):
     dependencies:
       '@volar/typescript': 2.4.2
diff --git a/src/App.vue b/src/App.vue
index bb666a8..99ebe43 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,6 +1,4 @@
-<script setup lang="ts">
-import HelloWorld from './components/HelloWorld.vue'
-</script>
+<script setup lang="ts"></script>
 
 <template>
   <div>
@@ -11,7 +9,10 @@ import HelloWorld from './components/HelloWorld.vue'
       <img src="./assets/vue.svg" class="logo vue" alt="Vue logo" />
     </a>
   </div>
-  <HelloWorld msg="Vite + Vue" />
+  <RouterLink to="/">Go to Home</RouterLink>
+
+  <RouterLink to="/about">Go to About</RouterLink>
+  <RouterView />
 </template>
 
 <style scoped>
diff --git a/src/components/Demo.vue b/src/components/Demo.vue
new file mode 100644
index 0000000..78543f9
--- /dev/null
+++ b/src/components/Demo.vue
@@ -0,0 +1,14 @@
+<script setup lang="ts"></script>
+
+<template>
+  <el-button>我是 ElButton</el-button>
+  <RouterLink to="/">Go to Home</RouterLink>
+
+  <RouterLink to="/about">Go to About</RouterLink>
+</template>
+
+<style scoped>
+.read-the-docs {
+  color: #888;
+}
+</style>
diff --git a/src/main.ts b/src/main.ts
index 40e5583..d1444cc 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,6 +1,8 @@
 import { createApp } from 'vue';
 import { createI18n } from 'vue-i18n';
+import { createMemoryHistory, createRouter } from 'vue-router';
 import App from './App.vue';
+import HelloWorld from './components/HelloWorld.vue';
 import './style.css';
 const i18n = createI18n({
   locale: 'zh',
@@ -18,7 +20,20 @@ const i18n = createI18n({
     },
   },
 });
+
+const routes = [
+  { path: '/', component: App },
+  { path: '/about', component: HelloWorld },
+];
+
+const router = createRouter({
+  history: createMemoryHistory(),
+  routes,
+});
 const app = createApp(App);
 
 app.use(i18n);
+
+app.use(router);
+
 app.mount('#app');
diff --git a/src/types/auto-import-components.d.ts b/src/types/auto-import-components.d.ts
index 19b3e8d..2a7930a 100644
--- a/src/types/auto-import-components.d.ts
+++ b/src/types/auto-import-components.d.ts
@@ -7,6 +7,8 @@ export {}
 /* prettier-ignore */
 declare module 'vue' {
   export interface GlobalComponents {
+    copy: typeof import('./../components/HelloWorld copy.vue')['default']
+    Demo: typeof import('./../components/Demo.vue')['default']
     ElButton: typeof import('element-plus/es')['ElButton']
     HelloWorld: typeof import('./../components/HelloWorld.vue')['default']
     SelectLanguage: typeof import('./../components/SelectLanguage.vue')['default']