我正在使用带有 ES6 模块语法的 TypeScript 1.6。
我的文件是:
测试.ts:
module App { export class SomeClass { getName(): string { return 'name'; } } }
main.ts:
import App from './test'; var a = new App.SomeClass();
当我尝试编译main.ts文件时,我收到此错误:
main.ts
错误 TS2306:文件“test.ts”不是模块。
我怎样才能做到这一点?
扩展 - 根据一些评论提供更多细节
错误
来自这里描述的事实http://exploringjs.com/es6/ch_modules.html
17. 模块 本章解释了内置模块在 ECMAScript 6 中是如何工作的。 17.1 概述 在 ECMAScript 6 中,模块存储在文件中。每个文件只有一个模块,每个模块一个文件。您有两种从模块中导出内容的方法。这两种方式可以混合使用,但通常最好分开使用。 17.1.1 多个命名导出 可以有多个命名导出: //------ lib.js ------ export const sqrt = Math.sqrt; export function square(x) { return x * x; } export function diag(x, y) { return sqrt(square(x) + square(y)); } ... 17.1.2 单一默认导出 可以有一个默认导出。例如,一个函数: //------ myFunc.js ------ export default function () { 路路路 } // no semicolon!
本章解释了内置模块在 ECMAScript 6 中是如何工作的。
17.1 概述
在 ECMAScript 6 中,模块存储在文件中。每个文件只有一个模块,每个模块一个文件。您有两种从模块中导出内容的方法。这两种方式可以混合使用,但通常最好分开使用。
17.1.1 多个命名导出
可以有多个命名导出:
//------ lib.js ------ export const sqrt = Math.sqrt; export function square(x) { return x * x; } export function diag(x, y) { return sqrt(square(x) + square(y)); } ...
17.1.2 单一默认导出
可以有一个默认导出。例如,一个函数:
//------ myFunc.js ------ export default function () { 路路路 } // no semicolon!
基于上述,我们需要 export , 作为 test.js 文件的一部分。让我们像这样调整它的内容:
export
// test.js - exporting es6 export module App { export class SomeClass { getName(): string { return 'name'; } } export class OtherClass { getName(): string { return 'name'; } } }
现在我们可以通过以下三种方式导入它:
import * as app1 from "./test"; import app2 = require("./test"); import {App} from "./test";
我们可以像这样消费进口的东西:
var a1: app1.App.SomeClass = new app1.App.SomeClass(); var a2: app1.App.OtherClass = new app1.App.OtherClass(); var b1: app2.App.SomeClass = new app2.App.SomeClass(); var b2: app2.App.OtherClass = new app2.App.OtherClass(); var c1: App.SomeClass = new App.SomeClass(); var c2: App.OtherClass = new App.OtherClass();
并调用该方法以查看它的实际效果:
console.log(a1.getName()) console.log(a2.getName()) console.log(b1.getName()) console.log(b2.getName()) console.log(c1.getName()) console.log(c2.getName())
原始部分试图帮助减少命名空间使用的复杂性
我真的强烈建议检查这个问答:
外部模块一起使用?](https://stackoverflow.com/q/30357634/1679310)
让我引用第一句话:
不要在外部模块中使用“命名空间”。 不要这样做。 严重地。停止。 …
…
在这种情况下,我们只是不需要 module inside of test.ts。这可能是它调整的内容 test.ts :
module
test.ts
export class SomeClass { getName(): string { return 'name'; } }
在这里阅读更多
在前面的例子中,当我们消费每个验证器时,每个模块只导出一个值。在这种情况下,通过它们的限定名称来处理这些符号是很麻烦的,而单个标识符也可以。 该export =语法指定 从模块导出的单个对象 。这可以是类、接口、模块、函数或枚举。导入时,直接使用导出的符号,并且没有任何名称限定。
在前面的例子中,当我们消费每个验证器时,每个模块只导出一个值。在这种情况下,通过它们的限定名称来处理这些符号是很麻烦的,而单个标识符也可以。
该export =语法指定 从模块导出的单个对象 。这可以是类、接口、模块、函数或枚举。导入时,直接使用导出的符号,并且没有任何名称限定。
export =
我们以后可以像这样使用它:
import App = require('./test'); var sc: App.SomeClass = new App.SomeClass(); sc.getName();
在这里阅读更多:
module-loading-and-other-advanced-loading-scenarios)
在某些情况下,您可能只想在某些条件下加载模块。在 TypeScript 中,我们可以使用下面显示的模式来实现这个和其他高级加载场景,以直接调用模块加载器而不会失去类型安全性。 编译器检测每个模块是否在发出的 JavaScript 中使用。对于仅用作类型系统一部分的模块,不会发出任何要求调用。这种对未使用引用的剔除是一种很好的性能优化,并且还允许可选地加载这些模块。 该模式的核心思想是 import id = require(‘…’) 语句让我们可以访问外部模块公开的类型。模块加载器被动态调用(通过 require),如下面的 if 块所示。这利用了引用剔除优化,以便仅在需要时加载模块。要使这种模式起作用,重要的是通过 import 定义的符号仅用于类型位置(即永远不会出现在将被发送到 JavaScript 中的位置)。
在某些情况下,您可能只想在某些条件下加载模块。在 TypeScript 中,我们可以使用下面显示的模式来实现这个和其他高级加载场景,以直接调用模块加载器而不会失去类型安全性。
编译器检测每个模块是否在发出的 JavaScript 中使用。对于仅用作类型系统一部分的模块,不会发出任何要求调用。这种对未使用引用的剔除是一种很好的性能优化,并且还允许可选地加载这些模块。
该模式的核心思想是 import id = require(‘…’) 语句让我们可以访问外部模块公开的类型。模块加载器被动态调用(通过 require),如下面的 if 块所示。这利用了引用剔除优化,以便仅在需要时加载模块。要使这种模式起作用,重要的是通过 import 定义的符号仅用于类型位置(即永远不会出现在将被发送到 JavaScript 中的位置)。