NuxtJs Typescript wait for asyncData to finish

Question

I have a rest call to a storyblok cos and the call itself works fine I get the correct data. But the call unfortunately happens after I create a component in my template which uses the data from that call so the app crashes. I am using NuxtJS with Typescript and this is how I call using asyncData

<script lang="ts">
import { Component, Vue } from 'nuxt-property-decorator'
import Card from '~/components/Card.vue'

@Component({
  components: {
    Card,
  },
})
export default class Index extends Vue {
  async asyncData({ app }: any): Promise<any> {
    const res = await app.$storyapi.get('cdn/stories', {
      starts_with: 'articles/',
      resolve_relations: 'author',
    })
    const articles = res.data.stories.map((story: any) => {
      story.content.date = new Date(story.content.date)
      return story
    })

    return { articles }
  }
}
</script>