TypeError: Object(...) is not a function in Vue

This happened to me when I forgot the curly braces in an import statement from vuex. I incorrectly coded:

import mapGetters from 'vuex'

Changing instead to the correct syntax:

import { mapGetters } from 'vuex'

Works fine.


It happened with me when i trying to generate a unique ID and imported it from quasar framework without curly braces

import uid  from 'quasar'

and it fixed when i added curly braces

import {uid}  from 'quasar'

The problem is your call to scheduleMeeting in your createMeeting method, or more precicely that you have not actually imported a function, but an object containing the function.

Your export from meeting.js

import session from "./session";

export default {
    scheduleMeeting(meeting) {
        return session.post("/meeting/create/", {
            ...meeting
        })
    }
};

this is exporting an object which you are assigning to scheduleMeeting in your import statement.

import scheduleMeeting from "../api/meeting"

So your function is actually at scheduleMeeting.scheduleMeeting inside your code.

It is a little unusual to export an object in this way - the default export is not quite the same as setting the export.modules object for a commonjs export. I suggest you follow a more ES6 method:

Change meeting.js to

import session from "./session";

export function scheduleMeeting(meeting) {
    return session.post("/meeting/create/", {
        ...meeting
    })
}

and your import statement to

import {scheduleMeeting} from "../api/meeting"

Of course there are other ways you could structure this to fix it, but I think this is the clearest.