我正在使用带有 ES6 模块语法的 TypeScript 1.6。

我的文件是:

测试.ts:

module App {
  export class SomeClass {
    getName(): string {
      return 'name';
    }
  }
}

ma​​in.ts:

import App from './test';

var a = new App.SomeClass();

当我试图编译 main.ts 文件时，我得到了这个错误:

Error TS2306: File 'test.ts' is not a module.

我怎样才能做到这一点？

最佳答案

扩展 - 根据一些评论提供更多细节

错误

Error TS2306: File 'test.ts' is not a module.

来自此处描述的事实http://exploringjs.com/es6/ch_modules.html

17. Modules

This chapter explains how the built-in modules work in ECMAScript 6.

17.1 Overview

In ECMAScript 6, modules are stored in files. There is exactly one module per file and one file per module. You have two ways of exporting things from a module. These two ways can be mixed, but it is usually better to use them separately.

17.1.1 Multiple named exports

There can be multiple named exports:

//------ 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 Single default export

There can be a single default export. For example, a function:

//------ myFunc.js ------
export default function () { ··· } // no semicolon!

基于以上内容，我们需要export，作为test.js 文件的一部分。让我们像这样调整它的内容:

// 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())

原始部分试图帮助降低命名空间使用的复杂性

原创部分:

我真的强烈建议检查这个问答:

How do I use namespaces with TypeScript external modules?

让我引用第一句话:

Do not use "namespaces" in external modules.

Don't do this.

Seriously. Stop.

...

在这种情况下，我们只是不需要 test.ts 中的 module。这可能是调整后的 test.ts 的内容:

export class SomeClass
{
    getName(): string
    {
        return 'name';
    }
}

在这里阅读更多

Export =

In the previous example, when we consumed each validator, each module only exported one value. In cases like this, it's cumbersome to work with these symbols through their qualified name when a single identifier would do just as well.

The export = syntax specifies a single object that is exported from the module. This can be a class, interface, module, function, or enum. When imported, the exported symbol is consumed directly and is not qualified by any name.

我们稍后可以像这样使用它:

import App = require('./test');

var sc: App.SomeClass = new App.SomeClass();

sc.getName();

在这里阅读更多:

Optional Module Loading and Other Advanced Loading Scenarios

In some cases, you may want to only load a module under some conditions. In TypeScript, we can use the pattern shown below to implement this and other advanced loading scenarios to directly invoke the module loaders without losing type safety.

The compiler detects whether each module is used in the emitted JavaScript. For modules that are only used as part of the type system, no require calls are emitted. This culling of unused references is a good performance optimization, and also allows for optional loading of those modules.

The core idea of the pattern is that the import id = require('...') statement gives us access to the types exposed by the external module. The module loader is invoked (through require) dynamically, as shown in the if blocks below. This leverages the reference-culling optimization so that the module is only loaded when needed. For this pattern to work, it's important that the symbol defined via import is only used in type positions (i.e. never in a position that would be emitted into the JavaScript).

关于javascript - TypeScript ES6 导入模块 "File is not a module error"，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32805559/