Question

我有TypeScript，它异步下载另一个TypeScript / javascript模块：

(function (exports) {
    "use strict";

    var path = require('path');

    exports.convertData = function (data) {
        return "converted " + data;
    }

})(typeof exports === 'undefined' ? this['converter.someConverter'] = {} : exports);

在我的主应用程序执行期间，我收到此模块为字符串，我必须从那里使用函数 convertData 。

所以，我正在尝试以下方法：

eval(rendererScript);
console.log(exports.convertData("some data"));

只有在 var path = require（＆＃39; path＆＃39;）的情况下才会删除。否则，出现以下错误： 未捕获（承诺）错误：模块名称＆＃34;路径＆＃34;尚未加载上下文：_。使用require（[]）

问题：

在这种情况下使用eval（）是否可以？（因为我们知道eval是邪恶的）
如何使用要求（＆＃39;路径＆＃39;）？我尝试使用 RequireJS （http://requirejs.org/docs/node.html#2）但收到以下错误：未捕获错误：＆＃34;路径＆＃34; 的脚本错误

被修改

因此，为了避免使用eval（），我们找到了以下解决方案：

const scriptTag = document.createElement("script");
scriptTag.innerHTML = rendererScript;
document.body.appendChild(scriptTag);
this.m_rendererPlugin = (window as any)[`converter.someConverter`];

Answer 1

由于您的情况是输入代码是动态的，因此您可能需要在运行时使用TypeScript编译器API进行编译。如果您没有专用的服务器，可以仍然使用TypeScript编译器API https://github.com/Microsoft/TypeScript/wiki/Using-the-Compiler-API在浏览器中编译TS项目。

在这里您有一个游乐场，可以在浏览器https://cancerberosgx.github.io/typescript-in-the-browser/typescript-compiler/#example=tsTranspilingProject1
您也可以在浏览器中使用ts-simple-ast库，该库的文档更完整，更易于使用-https://cancerberosgx.github.io/typescript-in-the-browser/typescript-compiler/#example=tsSimpleAst1

同样，对于转译，您无需执行任何其他操作，只需在HTML中包含node_modules / typescript / typescript.js即可。但是，对于类型检查和语言服务API（https://github.com/Microsoft/TypeScript/wiki/Writing-a-Language-Service-Plugin）等更复杂的API，您将需要实现一些接口。

在浏览器中动态执行TypeScript

1 个答案: