如何使用函数在JS中构建Typescript代码? [英] How to build Typescript code in JS using a function?

问题描述

尝试在JS中构建打字稿代码，以便我可以在UI上显示以供用户使用该代码，是否有办法将此代码创建为打字稿而不是文本，因此也可以进行编译?找不到任何与此问题相关的资源，将对在这里提供的任何帮助表示高度赞赏.

Trying to build typescript code in JS so i can display on UI for user to play with the code , is there a way to create this code as a typescript instead of text so it compile as well ? Any help here will be highly appreciated couldn't find any source related to this issue.

data包含接口

main.js

function buildTypescript(data) {
    var _ref = window.activeOperation;
    var modelData = getModelData(data);
    var text = '';
        text += "import {Api as IngenSDK} from '@SSDK'" + ';\n\n';
        text += modelData;
        text += 'app.Api.setConfig({\n    "env": "SIT3"\n});\n\n';
        text += _ref + '(' + JSON.stringify(SDKresult[_ref].request, null, 4) + ', function(result) {\n //Your code goes here \n debugger; \n console.log(result); \n});';
        $('#request_method_TS').text(text); 
}

    function getModelData(data){
        var activePath = window.activePath.toLowerCase();
        var _interface;

        $.each(data.children, function(id, item){
            // item.name would be string like "@SDK/core/interface/member/Details";
            var path = item.name.replace(/\"/g, "");
            if (path.toLowerCase().includes(activePath)) {
                console.log('OBJ', item);
                _interface = createInterfaces(path,item.children);     
            }
        });

        return _interface;
    }

    function createInterfaces(path, data) {
       const imports  = data.map(d => d.name).join(', ');
        return `import { ${imports} } from '${path}';\n\n`;

    }

html

<pre id="request_method_TS" style="margin: 5px;"></pre>

推荐答案

您可以通过执行以下操作将Typescript创建为可执行文件-

You can create the Typescript as executable by doing something like -

 const executableTypescript = new Function(typescriptDataAsText);

此时，字符串中的打字稿代码将已经编译.

The typescript code in the string will already be compiled at this point.

要执行它，只需调用新创建的函数--

To execute it, you just call the newly created function like -

 executableTypescript();

通过运行以下代码段检查是否已执行将消息记录到变量中的Typescript代码.
注意:对于您的情况，如果包含modelData以及更多此类Typescript数据，则它应该是新模块的一部分，因为它具有import语句，并且必须位于模块.

Check by running the below snippet that the Typescript code of logging the message in the variable is executed.
Note: For your case, if the modelData and more such Typescript data is included, it should be a part of a new module since it has import statements and they are required to be on top of a module.

var path = "/filepath"
var data = [
  {
        name: "IParam"
    },
    {
        name: "IError"
    }
]

function createInterfaces(path, data){
 const imports  = data.map(d => d.name).join(', ');
 return `import { ${imports} } from '${path}';\n\n`;
}

function buildTypescript(data) {
    // To include this data as part of your text, make sure that it's a part of a new module
    const modelData = createInterfaces(path,data);
    const text = `
        let message = "Typecript executed";\n\n
        console.log(message)`;
    return text;
}

const typescriptDataAsText = buildTypescript(data);

const executableTypescript = new Function(typescriptDataAsText);

executableTypescript()

这篇关于如何使用函数在JS中构建Typescript代码?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！