How to invoke a javascript function (generated from typescript) trapped within “System.register()” module?


How to invoke a javascript function (generated from typescript) trapped within “System.register()” module?



We have moved our application from Javascript to Typescript for obvious advantages of OOP etc..
Earlier invoking a direct javascript function from Html was as straight forward as:


window.MyFunction()



Now with Typescript, all the files are combined into a single autogenerated .js file.
In this single file, individual code of every file are isolated within System.register(). It typically looks something like:


System.register()


System.register("<filename>", ["<import_1>", ..., "<import_N>"],
function (exports_13, context_13) {
"use strict";

...

function MyFunction () { ... } // somewhere inside the external function
}



In short, everything is wrapped in an unnamed function, written within the .ts file.



Now, I don't know how to invoke a function, which is trapped inside another function, which is in turn listed under System.register(...)


System.register(...)



Question: What is the correct syntax to invoke such function externally from an Html file?


???



Update:



The HTML tries to invoke in following way in the body tag:



System.import("Main").then( // Main.ts is one of the file
function (module)
{
throw 0; // Temporary, to see if we reach till here
module.main(); // "main()" is the function, which is the entry point
});



In my code, I am using "browserify" to be able to use the Google protobuf for JS. The error comes for the protobuf related files only. Those definition and source files are present in .d.ts and .js formats.
The error is something like below:


js: Uncaught (in promise) Error: Fetch error: 404 NOT FOUND
Instantiating http://localhost:50000/folder/external/Server_pb
Loading http://localhost:50000/folder/external/_External
Loading Main



Note that, 50000 is a temporary port and the "folder" is just any folder where the .js are kept. The "Server_pb" is a custom protobuf file generated.



My problem can be aptly described quite similar as this link.



Related:



This question has not received enough attention.



Please ask me counter questions in comments, if something is missing. I am a newbie to TS & System





window.myfn() if you are sure it's on window
– Daniel Lizik
Jun 29 at 8:16


window.myfn()


window





@DanielLizik, assigning window.myfn = function () {} won't work in this case, because after the auto generation of the .js file, all the global statements will be part of the function.
– iammilind
Jun 29 at 8:55


window.myfn = function () {}





is system.js and your bundle imported? like this stackoverflow.com/a/44485955/763564 also What are you returning from the anonymous inner function?
– terminally-chill
12 hours ago






@terminally-chill, yes both "system.js" and the "autogen.js" (bundled one) are imported. Also we are trying to use the Google-protobuf. Due to which we have to use the "browserify". Hence the final file, which is a collection of many .ts, is also wrapped with some "browserify" code. The anonymous inner function returns another function (it's too complex for a newbie like me, due to TS to JS). Please see the Update section.
– iammilind
8 hours ago









By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Comments

Popular posts from this blog

paramiko-expect timeout is happening after executing the command

Opening a url is failing in Swift

Export result set on Dbeaver to CSV