如何将打字稿项目与html

时间:2019-02-19 00:56:34

标签: javascript html html5 typescript ecmascript-6

我想从HTML主体中调用打字稿功能。但是,由于我不完全了解生成的js代码,因此无法从HTML调用函数(D2O_main())。任何帮助将不胜感激。

我使用以下命令生成了js: tsc --module umd main.ts

这是html文件。

<head>
    <script type="text/javascript" src="main.js"></script>
</head>
<body onload="D2O_main();">
    <canvas id="canvas-001"></canvas>
</body>
</html>

这是main.ts文件:

import {Init} from "./Core/IO/Init"
let init:Init;
function D2O_main() {
    init = new Init("canvas-001");
}

这是生成的main.js文件:

(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define(["require", "exports", "./Core/IO/Init"], factory);
    }
})(function (require, exports) {
    "use strict";
    exports.__esModule = true;
    var Init_1 = require("./Core/IO/Init");
    var init;
    function D2O_main() {
        init = new Init_1.Init("canvas-001");
    }
});

在浏览器控制台上出现以下错误:

未捕获的ReferenceError:未定义D2O_main     在加载时

再次感谢您的帮助。

1 个答案:

答案 0 :(得分:1)

这是因为嵌套函数是函数作用域的-您需要将function D20_main移出包含在其中的IIFE,以有效地使其成为可全局访问的函数:

(function (factory) {...})(function (require, exports) {...}); 
function D20_main() {...}