Question

我来自C ++背景，并且在TypeScript中有一天的工作经验。我正在尝试实现一个在多个文件之间拆分的设计（接口/类）。它正在闪烁运行时错误：0x800a1391 - JavaScript runtime error: 'module' is not defined

Info.ts

export = Test; <-----------   0x800a1391 - JavaScript runtime error: 'module' is not defined
namespace Test {
    export class Info {
    }
}

TestWrapper.ts

import { Info } from "./Info";    
namespace Test {
    class TestWrapper {
        public GetInfo(): Info {
            return this.m_info;
        }
    }
}

我使用错误的方式吗？

Answer 1

一个猜测：

export = Something

编译为类似

module.exports = Something

module.exports是所谓的“ commonjs模块系统”的构造，该功能在浏览器中不可用，但在node.js中不可用。因此，如果您通过直接<script>导入在浏览器中运行生成的代码，则会带来类似的错误。 TS将imports和exports转换为可以在tsconfig.json中指定的模块系统，但是TS本身不负责实现模块系统。

该怎么办？

如果此代码确实应该在浏览器中运行，则可以选择以下两个选项之一：

通过模块捆绑器（webpack）运行代码，这将生成浏览器兼容的“捆绑包”（大JS），将所有文件连接在一起。 Webpack具有将Typescript作为插件包含在内的方法，因此您无需将“构建”分为两步；模块捆绑器通常相当复杂。
使您的文件无模块（这意味着：无需导入或导出顶级信息），并通过原始<script>标签将其导入。

Answer 2

我使用错误的方式吗？

尽管namespace在其他语言中也很常用，但在JavaScript中却不存在，因此打字稿版本只是为某些事物添加适当类型的一种很少使用的方式（我从未使用过）。在您的情况下，您实际上不需要名称空间。只是：

 export default class Info { /*...*/ }

那么你可以

import Info from ".Info";

export default class TestWrapper { /*...*/ }

PS：也就是说，我实际上不知道如何使用命名空间解决错误

Answer 3

您似乎正在尝试混合使用modules和namespaces。我建议阅读Namespaces and Modules。

您不需要使用export在最高级别export = Test，也不需要import { Info } from "./Info";，因为Info是{{1}的一部分} Test所属的名称空间。

如果要使用名称空间路由，请考虑：

Info.ts

TestWrapper

TestWrapper.ts

namespace Test {
    export class Info {}
}

Consumer.ts

namespace Test {
    export class TestWrapper {
        m_info: Info;
        public GetInfo(): Info {
            return this.m_info;
        }
    }
}

使用以下命令进行编译：

console.log(Test.TestWrapper);

然后使用：

tsc --outFile foo.js Info.ts TestWrapper.ts Consumer.ts

哪些印刷品：

node foo.js

0x800a1391-JavaScript运行时错误：未定义“模块”

3 个答案: