Menu
I have an HTML file and a JavaScript module. The JavaScript module exports a function, which I want to call in the HTML file.
index.html
<html>
<head>
<script type="module" src="app.js"></script>
</head>
<body>
<button onclick="greet()">Greetings from module</button>
</body>
</html>
index.js
function greet() {
alert('Hello');
}
When Greetings from module button is clicked, the following error is thrown:
Uncaught ReferenceError: greet is not defined
at onclick
Note: app.js has to be a marked as a module.
977
First of all you have to explicitly export you function:
export function greet() {
alert("Hello from module");
}
Secondly, a module has it's own scope (this is the whole point of modules) thus you need to add the function to the global scope. So, to do it you have to run a script which imports the function and adds it to the window object:
<script type="module">
import { greet } from "./app.js";
window.greetFromModule = greet;
</script>
Now you don't need this part <script type="module" src="app.js"></script>
Alternatively you can create an empty obj and add your modules stuff to it, this is what it would look like:
<html>
<head></head>
<body>
<button onclick="greetFromHtml();">greetFromHtml</button>
<button onclick="module.greet()">greetFromModule</button>
<script type="text/javascript">
function greetFromHtml() {
alert("Hello");
}
const module = {};
</script>
<script type="module">
import { greet } from "./app.js";
module.greet = greet;
</script>
</body>
</html>
answered Sep 05 '25 05:09
myscript.js
export const sampleFunction=()=>{
alert("Hello I'm sample");
}
index.js
import {sampleFunction} from './myscript.js';
window.sampleFunction=sampleFunction;
index.html
<script type='module' src='./index.js'></script>
<button onclick="sampleFunction()">Click me</button>
In the script tag make script type = 'module' and src = './index.js'. Now it should be working.
30
answered Sep 05 '25 07:09
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With