refactor: refactor for <script setup>

src/client/app/components/Debug.vue

@@ -8,25 +8,16 @@
   </div>
 </template>
 
-<script lang="ts">
+<script setup lang="ts">
-import { defineComponent, ref, watch } from 'vue'
+import { ref, watch } from 'vue'
 
-export default defineComponent({
+const el = ref<HTMLElement | null>(null)
-  setup() {
+const open = ref(false)
-    const el = ref<HTMLElement | null>(null)
-    const open = ref(false)
 
-    watch(open, (value) => {
+watch(open, (value) => {
   if (value === false) {
     el.value!.scrollTop = 0
   }
-    })
-
-    return {
-      el,
-      open
-    }
-  }
 })
 </script>
 

src/client/theme-default/components/LastUpdated.vue

@@ -5,39 +5,29 @@
   </p>
 </template>
 
-<script lang="ts">
+<script setup lang="ts">
-import { defineComponent, ref, computed, onMounted } from 'vue'
+import { ref, computed, onMounted } from 'vue'
 import { useSiteDataByRoute, usePageData } from 'vitepress'
 
-export default defineComponent({
+const site = useSiteDataByRoute()
-  setup() {
+const page = usePageData()
-    const site = useSiteDataByRoute()
-    const page = usePageData()
 
-    const datetime = ref('')
+const datetime = ref('')
 
-    const hasLastUpdated = computed(() => {
+const hasLastUpdated = computed(() => {
   const lu = site.value.themeConfig.lastUpdated
 
   return lu !== undefined && lu !== false
-    })
+})
 
-    const prefix = computed(() => {
+const prefix = computed(() => {
   const p = site.value.themeConfig.lastUpdated
 
   return p === true ? 'Last Updated' : p
-    })
+})
 
-    onMounted(() => {
+onMounted(() => {
   datetime.value = new Date(page.value.lastUpdated).toLocaleString('en-US')
-    })
-
-    return {
-      hasLastUpdated,
-      prefix,
-      datetime
-    }
-  }
 })
 </script>
 

src/client/theme-default/components/PageFooter.vue

@@ -9,17 +9,9 @@
   </footer>
 </template>
 
-<script lang="ts">
+<script setup lang="ts">
-import { defineComponent } from 'vue'
 import EditLink from './EditLink.vue'
 import LastUpdated from './LastUpdated.vue'
-
-export default defineComponent({
-  components: {
-    EditLink,
-    LastUpdated
-  }
-})
 </script>
 
 <style scoped>