Javascript import function syntax [duplicate]

Question

I am trying to import a function from another module but on running am getting an error:

TypeError: _this.getData is not a function.

data.js

function getData() {
  return [
    { id: 1,
      name: 'Pluto',
      type: 'Dwarf Planet'
    },
    { id: 2,
      name: 'Neptune',
      type: 'Planet'
    }
  ]
}
export { getData }

worker.js

import getData from data.js

this.data = this.getData()

Then on run I get the browser error as mentioned above. Any ideas as to what I am doing incorrectly?

Answer 1

That should be

import { getData } from data.js

Without the brackets, you're importing the default export which doesn't exist.

Answer 2

You should omit the "this" keyword when using "getData()" it doesn't belong on the current object.

function getData() { .... }

export default getData;

import getData from "data.js"

this.data = getData();

Answer 3

Change your import as a named import like this:

import { getData } from data.js

Or export getData function as a default export like this:

export default { getData }