Why there's error in onclick when i have "module" in script tag?

Question

I have button with function and it looks like this :

<button onclick="myFunction()">Click</button>
<script type="module" src="main.js"></script>

And there's main.js file :

function myFunction(){
   console.log('Button has been clicked');
}

Without module type in script tag it works fine but when there's module type in it, console throws error:

Uncaught TypeError: window.myFunction is not a function at HTMLButtonElement.onclick

How to fix it to work fine with module?

I think you miss the whole point of modules. Think `import` and `export`, without using them, modules makes no sense. — Keith, Jun 29 '20 at 19:47
I believe you need to do some more research on modules: https://javascript.info/modules-intro — Martin, Jun 29 '20 at 19:48

score 7 · Accepted Answer · answered Jun 29 '20 at 19:46

7

Default scope in modules is the module and not global.

Attach event handlers using addEventListener in JavaScript instead of intrinsic event attributes in HTML.

answered Jun 29 '20 at 19:46

Quentin

1 Answers1