Working

src/components/About.vue

@@ -2,7 +2,7 @@
   <section v-if="age" class="w-full flex items-center justify-center my-12">
     <div class="flex flex-col md:flex-row justify-between items-center">
       <div class="mb-12 md:mb-0 w-full md:w-1/2 flex justify-center">
-        <img src="~/assets/images/memojies/Hat.png" alt="It's me !" class="xl:w-1/2" />
+        <img src="@/assets/images/memojies/Hat.png" alt="It's me !" class="xl:w-1/2" />
       </div>
       <div class="md:w-1/2 text-justify">
         <h2 class="text-4xl font-bold text-center md:text-justify">
@@ -12,7 +12,7 @@
           {{ $t('home.about.description', {age: age}) }}
         </p>
         <div class="flex justify-center md:justify-start">
-          <Button content="home.about.about" link="about"/>
+          <Button content="home.about.about" link="about" />
         </div>
       </div>
     </div>
@@ -23,9 +23,10 @@
 import {defineComponent, useAsync, useContext} from "@nuxtjs/composition-api";
 
 export default defineComponent({
-  name: "AboutHome",
+  name: "About",
   setup() {
     const {$axios, $sentry, app} = useContext()
+
     const age = useAsync(async () => {
       const response = await $axios.get('/api/informations', {
         headers: {

src/components/Announce.vue

@@ -17,10 +17,10 @@
 </template>
 
 <script lang="ts">
-import {computed, useAsync, useContext} from "@nuxtjs/composition-api";
+import {computed, defineComponent, useAsync, useContext} from "@nuxtjs/composition-api";
 
-export default {
-  name: "Announcement",
+export default defineComponent({
+  name: "Announce",
   setup() {
     const {$axios, $sentry, app} = useContext()
 
@@ -60,5 +60,5 @@ export default {
       getHoverColor,
     }
   }
-}
+})
 </script>

src/components/PresentationAbout.vue

@@ -15,6 +15,6 @@
 
 <script>
 export default {
-  name: "SkillsAbout"
+  name: "PresentationAbout"
 }
 </script>