I have a file that exports an async function, like this
// api.js
import { getInfo } from "somewhere";
export async function getSomething() {
await getInfo()
}
and then I'm trying to import it into another file like this.
// Dashboard.vue
import { getSomething } from "./api.js";
async created() {
await getSomething()
},
but I'm getting this error
Syntax Error: Unexpected reserved word 'await'. (77:26)
77 | await getSomething()
Of course, this is all pseudo-code but the problem is -- why does my file not recognize the imported method as an async call? Is there a different way to import something when it is an async method?
edit: perhaps my code is not giving enough context, so here is a better example of how I'm consuming the async method
<template>
<div>Hello world</div>
</template>
<script>
import { getSomething } from "./api";
export default {
methods: {
async init() {
await getSomething()
}
},
async created() {
await this.init()
}
};
</script>
here is an exact view of the compile failure. getAssessment === getSomething in my example above
ERROR Failed to compile with 1 error 1:29:06 AM
error in ./src/components/Dashboard.vue?vue&type=script&lang=js&
Syntax Error: Unexpected reserved word 'await'. (79:26)
77 | if (user) {
78 | this.user = user;
> 79 | this.assessment = await getAssessment();
| ^
80 | }
Try this:
// api.js
import { getInfo } from 'somewhere'
export const getSomething = async () => {
return await getInfo();
}
// another file
import { getSomething } from './api.js'
const created = async () => {
await getSomething();
}
created();