I am trying to bring a function from a typescript-generated module into the global namespace of JavaScript. The typescript module I have is called foo.ts:
export const fooFn = (): string => {
return "hello";
};
Below is the structure of my HTML file:
<html>
<body>
<script src="foo.ts"></script>
<script type="application/javascript">
window.fooFn = require("./foo.ts").fooFn;
alert(fooFn());
</script>
</body>
</html>
When attempting this, I encounter an error stating Cannot find module './foo.ts'. After experimentation, I discovered that I can import it using a parcel-generated index (such as window.fooFn = require(7).fooFn), but this workaround is not sustainable as the index changes each time I restart the parcel dev server.
My question is, how can I properly import this module by its name?
For reference, here is my tsconfig.json:
{
"compilerOptions": {
"strict": true,
"target": "es2015",
"jsx": "react",
}
}
If you are curious about why I need to expose this function on the global namespace, it is for easy access within a WebAssembly application.