简体   繁体   English

如何在 Duktape 中使用 typescript 模块

[英]How to use typescript modules with Duktape

I am trying to use JS as a scripting language in a game engine, with TypeScript on top.我正在尝试将 JS 用作游戏引擎中的脚本语言,其中 TypeScript 位于顶部。 As runtime I use Duktape .作为运行时,我使用Duktape I am a complete noob regarding JavaScript and currently I am trying to wrap my head around how I can enable a workflow where people can #include (require etc.) other files.关于 JavaScript,我完全是个菜鸟,目前我正试图围绕如何启用人们可以#include(需要等)其他文件的工作流程。

For testing purposes I started with two simple TypeScript files:出于测试目的,我从两个简单的 TypeScript 文件开始:

Foo.ts

declare function Print(text : string) : void;

export module Foo 
{
    export function GetFoo(): string 
    {
        return "Foo"
    }

    Print("Foo: " + GetFoo())
}

Bar.ts巴茨

import { Foo } from "./Foo"

declare function Print(text: string): void;

Print("Bar: " + Foo.GetFoo())

Now I put both through TypeScript's Transpile function (from typescriptServices.js) and get:现在我通过 TypeScript 的 Transpile function(来自 typescriptServices.js)得到:

Foo.js Foo.js

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var Foo;
(function (Foo) {
    function GetFoo() {
        return "Foo";
    }
    Foo.GetFoo = GetFoo;
    Print("Foo: " + GetFoo());
})(Foo = exports.Foo || (exports.Foo = {}));

Bar.js酒吧.js

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var Foo_1 = require("./Foo");
Print("Bar: " + Foo_1.Foo.GetFoo());

I then want to execute Bar.js through Duktape.然后我想通过 Duktape 执行 Bar.js。 I read this so my understanding is that there are multiple ways to make including other files work, but this one seems to make specifically the 'require' function work, so it sounds about right for the JS code that TypeScript generated for me.我读了这篇文章,所以我的理解是有多种方法可以使包括其他文件工作,但是这个似乎特别使“要求” function 工作,所以这听起来很适合 TypeScript 为我生成的 JS 代码。 So I create a Duktape context, I call duk_module_duktape_init on it and I register a 'modSearch' function etc. BUT before it actually even gets to the 'require' part of Bar.js, Duktape already fails with the message "ReferenceError: identifier 'exports' undefined" .因此,我创建了一个 Duktape 上下文,在其上调用 duk_module_duktape_init 并注册了一个“modSearch”function 等。但在它实际到达 Bar.js 的“require”部分之前,Duktape 已经失败并显示消息“ReferenceError:标识符”出口未定义”

As mentioned before, I am really new to JS and TS and may have the wrong idea about this whole endeavor, so feel free to suggest entirely different approaches.如前所述,我对 JS 和 TS 真的很陌生,可能对整个工作有错误的想法,所以请随意提出完全不同的方法。 All I care about is that users can split up code into multiple files, and somehow reference those files in such a way that tools such as VS Code can figure out those references and provide their functionality to develop code.我所关心的是用户可以将代码拆分为多个文件,并以某种方式引用这些文件,以便 VS Code 等工具可以找出这些引用并提供它们的功能来开发代码。 I do not care whether I end up using 'require' or 'import' and whether I can use all TS features or just some sub-set.我不在乎我最终是使用“require”还是“import”,以及我是否可以使用所有 TS 功能或只是一些子集。

Long story short, what am I doing wrong and how can I make this work?长话短说,我做错了什么,我怎样才能做到这一点?

Late last night I figured out what my problem was, I'll post it here in case anyone ever runs into a similar problem.昨晚深夜,我弄清楚了我的问题是什么,我会在这里发布以防万一有人遇到类似的问题。

The problem is that TypeScript generated code to set the '__esModule' property for both files.问题是 TypeScript 生成代码来设置两个文件的“__esModule”属性。 Only Foo.ts exported anything and was used in a 'require' call, but for Bar.ts the transpiled JS code also wants to access the 'exports' object.只有 Foo.ts 导出任何内容并在“require”调用中使用,但对于 Bar.ts,转译后的 JS 代码也希望访问“exports”object。

In Duktape, when you use duk_module_duktape_init to enable support for the 'require' function, it will generate an 'exports' object but ONLY once you go through an actual 'require()' call and only for the module to be loaded of course. In Duktape, when you use duk_module_duktape_init to enable support for the 'require' function, it will generate an 'exports' object but ONLY once you go through an actual 'require()' call and only for the module to be loaded of course.

The problem here is that already the top-level file (which is not loaded through a require-call) tries to access an 'exports' object which does not exist for this file.这里的问题是,顶级文件(不是通过要求调用加载的)已经尝试访问此文件不存在的“导出”object。

The solution is quite simply to create a dummy object, ie.解决方案很简单,就是创建一个虚拟 object,即。 by prepending 'var exports = {}' to the top-level script file.通过将 'var exports = {}' 添加到顶级脚本文件。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM