初始化路由

coderjam · coderjam · commit 704d79039e91 · 2022-03-17T22:20:57.000+08:00
diff --git a/zhiwei-ui-vue3/index.html b/zhiwei-ui-vue3/index.html
@@ -8,6 +8,6 @@
 </head>
 <body>
   <div id="app"></div>
-  <script type="module" src="/src/main.js"></script>
+  <script type="module" src="/src/main.ts"></script>
 </body>
 </html>
diff --git a/zhiwei-ui-vue3/package.json b/zhiwei-ui-vue3/package.json
@@ -6,10 +6,11 @@
     "build": "vite build"
   },
   "dependencies": {
-    "vue": "^3.0.0-rc.1"
+    "vue": "^3.0.0-rc.1",
+    "vue-router": "4.0.12"
   },
   "devDependencies": {
-    "vite": "^1.0.0-rc.1",
-    "@vue/compiler-sfc": "^3.0.0-rc.1"
+    "@vue/compiler-sfc": "^3.0.0-rc.1",
+    "vite": "^1.0.0-rc.1"
   }
-}
+}
diff --git a/zhiwei-ui-vue3/src/App.vue b/zhiwei-ui-vue3/src/App.vue
@@ -1,15 +1,13 @@
 <template>
-  <img alt="Vue logo" src="./assets/logo.png" />
-  <HelloWorld msg="Hello Vue 3.0 + Vite" />
+  <div>导航栏</div>
+  <router-link to="/">首页</router-link>
+  <router-link to="/jam">jam</router-link>
+  <hr/>
+  <router-view />
 </template>
 
 <script>
-import HelloWorld from './components/HelloWorld.vue'
-
 export default {
-  name: 'App',
-  components: {
-    HelloWorld
-  }
+  name: 'App'
 }
 </script>
diff --git a/zhiwei-ui-vue3/src/components/Jam2.vue b/zhiwei-ui-vue3/src/components/Jam2.vue
@@ -0,0 +1,5 @@
+<template>
+    <div>
+        jam22222~
+    </div>
+</template>
diff --git a/zhiwei-ui-vue3/src/main.js b/zhiwei-ui-vue3/src/main.js
diff --git a/zhiwei-ui-vue3/src/main.ts b/zhiwei-ui-vue3/src/main.ts
@@ -0,0 +1,18 @@
+import { createApp } from 'vue'
+import App from './App.vue'
+import './index.css'
+import { createWebHashHistory,createRouter } from 'vue-router'
+import Jam from './components/Jam.vue'
+import Jam2 from './components/Jam2.vue'
+const history = createWebHashHistory()
+const router = createRouter({
+    history:history,
+    routes:[
+        { path:'/',component:Jam },
+        { path:'/jam',component:Jam2 },
+    ]
+})
+
+const app = createApp(App)
+app.use(router)
+app.mount('#app')
diff --git a/zhiwei-ui-vue3/src/shims-vue.d.ts b/zhiwei-ui-vue3/src/shims-vue.d.ts
@@ -0,0 +1,5 @@
+declare module '*.vue' {
+    import { ComponentOptions } from 'vue'
+    const componentOptions: ComponentOptions
+    export default componentOptions
+}
diff --git a/zhiwei-ui-vue3/yarn.lock b/zhiwei-ui-vue3/yarn.lock
@@ -296,6 +296,11 @@
     "@vue/compiler-dom" "3.2.31"
     "@vue/shared" "3.2.31"
 
+"@vue/devtools-api@^6.0.0-beta.18":
+  version "6.1.3"
+  resolved "https://registry.npmmirror.com/@vue/devtools-api/-/devtools-api-6.1.3.tgz#a44c52e8fa6d22f84db3abdcdd0be5135b7dd7cf"
+  integrity sha512-79InfO2xHv+WHIrH1bHXQUiQD/wMls9qBk6WVwGCbdwP7/3zINtvqPNMtmSHXsIKjvUAHc8L0ouOj6ZQQRmcXg==
+
 "@vue/reactivity-transform@3.2.31":
   version "3.2.31"
   resolved "https://registry.npmmirror.com/@vue/reactivity-transform/-/reactivity-transform-3.2.31.tgz#0f5b25c24e70edab2b613d5305c465b50fc00911"
@@ -1839,6 +1844,13 @@ vite@^1.0.0-rc.1:
     vue "^3.0.3"
     ws "^7.3.1"
 
+vue-router@4.0.12:
+  version "4.0.12"
+  resolved "https://registry.npmmirror.com/vue-router/-/vue-router-4.0.12.tgz#8dc792cddf5bb1abcc3908f9064136de7e13c460"
+  integrity sha512-CPXvfqe+mZLB1kBWssssTiWg4EQERyqJZes7USiqfW9B5N2x+nHlnsM1D3b5CaJ6qgCvMmYJnz+G0iWjNCvXrg==
+  dependencies:
+    "@vue/devtools-api" "^6.0.0-beta.18"
+
 vue@^3.0.0-rc.1, vue@^3.0.3:
   version "3.2.31"
   resolved "https://registry.npmmirror.com/vue/-/vue-3.2.31.tgz#e0c49924335e9f188352816788a4cca10f817ce6"
