前台页面框架完成

src/router/index.js

@@ -1,33 +1,51 @@
 import Vue from 'vue'
 import VueRouter from 'vue-router'
-import HomeView from '../views/HomeView.vue'
+import index from '../views/index.vue'
+import home from "@/components/Home.vue";
+import monthly from "@/components/Monthly.vue";
+import ranking from "@/components/Ranking.vue";
+import paper from "@/components/Paper.vue";
 
 Vue.use(VueRouter)
 
 const routes = [
-  {
-    path: '/',
-    name: 'home',
-    component: HomeView
-  },
-  {
-    path: '/about',
-    name: 'about',
-    // route level code-splitting
-    // this generates a separate chunk (about.[hash].js) for this route
-    // which is lazy-loaded when the route is visited.
-    component: () => import(/* webpackChunkName: "about" */ '../views/AboutView.vue')
-  },
-  {
-    path: '/login',
-    name: 'login',
-    component: ()=>import('../views/LoginView.vue')
-  }
+    {
+        path: '/',
+        redirect: '/index'
+    },
+    {
+        path: '/index',
+        redirect: '/home',
+        name: 'index',
+        component: index,
+        children: [
+            {
+                path: '/Home',
+                name: 'Home',
+                component: home
+            },
+            {
+                path: '/monthly',
+                name: 'monthly',
+                component: monthly
+            },
+            {
+                path: '/ranking',
+                name: 'ranking',
+                component: ranking
+            },
+            {
+                path: '/paper',
+                name: 'paper',
+                component: paper
+            },
+        ]
+    }
 
 ]
 
 const router = new VueRouter({
-  routes
+    routes
 })
 
 export default router