[Vuejs]-Importing a async function ES6 vuejs and TypeScript

by

0👍

✅

You’re trying to use a named import when you import but are making the module as a default export. To fix this, you can just
import getTags from '@/functions/blog'.

Technically getTags is not a Named export, it’s the default export. If you’re planning to have a bunch of functions in one file, and want to use named exports/imports you just have to remove the default from your function.
Now you will be able to pick and choose what to import since they are named exports!
There’s a simple blog post that goes over this pretty quickly here

This is how your file(blog.ts) with multiple named exports (with your functions) would look like.

export async function getTags (uid) {
  const tags = db.collection('tags').where('blogId', '==', uid)
  const data = []
  await tags.get()
    .then(snapshot => {
      snapshot.forEach(doc => {
        console.log(doc.data())
        data.push(doc.data().tag)
      })
      return data
    })
    .catch(err => {
      console.log('Error getting documents', err)
    })
}

export async function getLaundry(uid) {
  //stuff
}

Then in your file that you want to import just the ones you want, let’s say you just want getLaundry you can do so like:

import { getLaundry } from '@/functions/blog'

Or both like:

import { getLaundry, getTags } from '@/functions/blog'

Leave a comment