ES6 Modules: Undefined onclick function after import

by

Module creates a scope to avoid name collisions.

Either expose your function to window object

import {hello} from './test.js'

window.hello = hello

Or use addEventListener to bind handler. Demo

<button type="button" id="hello">Click Me</button>
<script type="module">
  import {hello} from './test.js'

  document.querySelector('#hello').addEventListener('click', hello)
</script>

More Related Contents:

  1. Is it possible to import modules from all files in a directory, using a wildcard?
  2. Pass options to ES6 module imports
  3. `export const` vs. `export default` in ES6
  4. Node.js plans to support import/export ES6 (ECMAScript 2015) modules
  5. using brackets with javascript import syntax
  6. ES2015 import doesn’t work (even at top-level) in Firefox
  7. Which browsers support import and export syntax for ECMAScript 6?
  8. ES6 modules in the browser: Uncaught SyntaxError: Unexpected token import
  9. ES6: import module from URL
  10. ES6 Destructuring and Module imports
  11. Is using an ES6 import to load specific names faster than importing a namespace?
  12. Javascript ES6 export const vs export let
  13. ES6 module Import giving “Uncaught SyntaxError: Unexpected identifier”
  14. How can I alias a default import in JavaScript?
  15. Are ES6 module imports hoisted?
  16. Not recommended to use “use strict” in ES6?
  17. Inlining ECMAScript Modules in HTML
  18. What is the defined execution order of ES6 imports?
  19. What is the difference between importing a function expression or a function declaration from a ES6 module?
  20. How will browsers handle ES6 import/export syntax
  21. ES2015 “import” not working in node v6.0.0 with with –harmony_modules option
  22. Re-export default in ES 6 modules
  23. Output an ES module using webpack
  24. How does JavaScript import find the module without an extension?
  25. Map vs Object in JavaScript
  26. Arrow Function in Object Literal [duplicate]
  27. How do I merge two javascript objects together in ES6+?
  28. Destructuring in Node.JS
  29. Is it possible to sort a ES6 map object?
  30. gulp babel, exports is not defined

Leave a Comment