Uncaught TypeError: (0 , _module) is not a function

Question

I'm using parcel, and I'm trying to use ES6 import and export syntax. Parcel seems to run babel underground, I'm very new to it. When openimn the index.html placed on "dist" folder it does not render well and shows this error in console: "Uncaught TypeError: (0 , _module.importedHi) is not a function"

This the code in the exporting JS file:

export const importedHi = document.write("Hello world")

And this is the code of the main.js:

import {importedHi} from "./module1";

importedHi()

And this is the script im using in index.html

<script src="js/main.js"></script>

What do I have to configure so that this works properly?

Answer 1

document.write returns undefined, so importedHi is undefined, and importedHi() throws an error. You probably wanted to export a function that calls document.write, eg:

export const importedHi = () => document.write("Hello world");

Still, if you're at the point that you can use modules and bundlers, you should probably use more modern methods of manipulating the DOM, like createElement / appendChild and such, perhaps something like

export const importedHi = () => {
  document.body.appendChild(document.createTextNode('Hello world'));
};