plan for ssg

packages/nuxt/pages/post/_.vue

@@ -1,9 +1,5 @@
 <template>
-  <p v-if="$fetchState.pending"></p>
-  <p v-else-if="$fetchState.error">
-    An error occurred {{ $fetchState.error.message }}
-  </p>
-  <section v-else>
+  <section>
     <section>
       <h2>
         {{ post.title }}
@@ -29,7 +25,7 @@
       </small>
     </section>
 
-    <section v-html="post.content"></section>
+    <section v-html="post.contentHtml"></section>
 
     <section class="tags-container">
       <span>Tags:</span>
@@ -52,14 +48,16 @@ import { THEME } from '~/assets/global'
 import '~/assets/remark42'
 
 @Component<PostPage>({
-  async fetch() {
-    const r = await this.$axios.$get('/api', {
+  async asyncData({ $axios, params }) {
+    const r = await $axios.$get('/api', {
       params: {
-        path: this.$route.params.pathMatch,
+        path: params.pathMatch,
       },
     })
 
-    this.post = r
+    return {
+      post: r,
+    }
   },
   mounted() {
     this.initRemark42()
@@ -76,7 +74,7 @@ export default class PostPage extends Vue {
     title: string
     image?: string
     tag?: string[]
-    category?: string
+    category?: string[]
     content: string
   } | null = null
 
@@ -85,7 +83,7 @@ export default class PostPage extends Vue {
   remark42settings = THEME.comment?.remark42 || null
   remark42Instance: any = null
 
-  @Watch('$fetchState.pending')
+  @Watch('$route.params.pathMatch')
   initRemark42() {
     this.$nextTick(() => {
       if (