"Missing semicolon" error on Async function declaration

May 3, 2022

In a Vue app, I want to group js functions in a js file. In getData.js , I have the following:

import { collection, getDocs } from 'firebase/firestore/lite';
import { db } from "./firebase/index";
import store from "../store/index"

  
  async getProjects () { 
    const querySnapshot = await getDocs(collection(db, "projects"));
      querySnapshot.forEach((doc) => {
      let project = doc.data()
      project.id = doc.id
      store.state.currentProjectList.push(project)
    });
  }



  export { getProjects }

I get the "Missing semicolon." error on the line where I declare the function: async getProjects().

(I know this isn’t the way to add data to the store but this is only for testing purpose)

Thanks for any help!

>Solution :

async getProjects () { is method declaration syntax; it is only allowed inside an object or class definition.

To create a local function you need to use a function declaration or an arrow function.

async function getProjects () {

const getProjects = async () => {

(You could also use a function expression, but that gets even further from the syntax you had).

You also have a missing semi-colon at the of the previous line – import store from "../store/index" which isn’t a JS error (but might be a linting error if you are using a linter and didn’t mention that).