update

src/App.vue

@@ -1,19 +1,15 @@
 <script setup lang="ts">
   import Header from "./components/Header.vue"
-  import Home from "./pages/Home.vue"
+  import Main from "./components/Main.vue"
   import Footer from "./components/Footer.vue"
 </script>
 
 <template>
   <Header />
-  <main>
-    <Home />
-  </main>
+  <Main />
   <Footer />
 </template>
 
-<style scoped>
-main{
-  text-align: center;
-}
+<style lang="scss">
+
 </style>

src/components/Main.vue

@@ -0,0 +1,17 @@
+<template>
+  <div class='main'>
+    <Home />
+  </div>
+</template>
+
+<script setup lang="ts">
+  import {  } from 'vue'
+  import Home from '../pages/Home.vue'
+  
+</script>
+
+<style lang='scss' scoped>
+  .main{
+    text-align: center;
+  }
+</style>