TODO: 理解完整的vue建站流程

src/components/Main.vue

@@ -2,12 +2,12 @@
   <!-- App.vue -->
 <v-app>
 
-  <v-app-bar app>
+  <v-app-bar app height="150px">
     <!-- -->
   </v-app-bar>
-  <v-navigation-drawer app>
+  <!-- <v-navigation-drawer app> -->
     <!-- -->
-  </v-navigation-drawer>
+  <!-- </v-navigation-drawer> -->
 
 
 
@@ -15,10 +15,12 @@
   <v-main>
     <!-- Provides the application the proper gutter -->
     <v-container fluid>
-    <div id="nav">
-      <router-link to="/">Home</router-link> |
-      <router-link to="/about">About</router-link>
-    </div>
+
+    <!-- <div id="nav"> -->
+      <!-- <router-link to="/">Home</router-link> | -->
+      <!-- <router-link to="/about">About</router-link> -->
+    <!-- </div> -->
+
       <!-- If using vue-router -->
       <!-- <router-view></router-view> -->
     </v-container>
@@ -33,6 +35,6 @@
 
 <script>
   export default {
-    name: 'HelloWorld',
+    name: 'Main',
   }
 </script>

src/views/Home.vue

@@ -1,19 +1,18 @@
 <template>
-  <!-- <div class="home"> -->
-    <!-- <img alt="Vue logo" src="../assets/logo.png"> -->
-    <HelloWorld msg="Welcome to Your Vue.js App"/>
-  <!-- </div> -->
+ <!-- App.vue -->
+ <Main></Main>
 </template>
 
 <script>
 
 // @ is an alias to /src
-import HelloWorld from '@/components/HelloWorld.vue'
+// import Main from '@/components/HelloWorld.vue'
+import Main from '../components/Main.vue'
 
 export default {
   name: 'Home',
   components: {
-    HelloWorld
+    Main,
   }
 }
 </script>