打字稿:如何将定义分解为单独的文件

时间:2017-08-21 19:29:26

标签: typescript visual-studio-code

我使用单个定义文件进行整个TS项目,并且工作正常。

我想知道是否有可能打破这个问题。按功能/组件定义到单独的文件中。这样,每个组件都会拥有它自己的定义,扩充主定义命名空间,就像@types关于角度及其插件(animate,ui.router等)的方式一样。但我不确定如何做到这一点。

我的文件夹结构:

index.ts
index.d.ts
app
    shared
        shared.ts
        shared.d.ts
        user.ts
        config.ts
    login
        login.ts
        login.d.ts
        login.component.ts
        login.component.html

我的定义文件:

// shared.d.ts
export namespace shared {
    interface IConfig {
        url: string;
    }
}

// login.d.ts
export namespace login {
    interface ILogin {
        logIn(): Promise<any>;
        logOut(): Promise<any>;
    }
}

// index.d.ts
import * as sharedModule from './app/shared/shared';
import * as loginModule from './app/login/login';

declare module App {
    // extend the App module with the imported definitions. How?   
}

我的tsconfig.json

{
  "compilerOptions": {
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "typeRoots": ["node_modules/@types/", "src/"]
  },
  "compileOnSave": false,
  "filesGlob": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "!node_modules/**"
  ]
}

有可能吗?我怎么能这样做?

1 个答案:

答案 0 :(得分:1)

一种方法是使用reference pathdeclare命名空间,而不是导出它们。

shared.d.ts

declare namespace shared {
    interface IConfig {
        url: string;
    }
}

login.d.ts

declare namespace login {
    interface ILogin {
        logIn(): Promise<any>;
        logOut(): Promise<any>;
    }
}

index.d.ts

/// <reference path="shared.d.ts" />
/// <reference path="login.d.ts" />

declare module "App" {
    // we now have access to the `shared` namespace.
    const config: shared.IConfig;
}

以上是在VSCode中工作的上述截图。

enter image description here