TypeScript 1.8 模块:从文件夹导入所有文件

36

我正在使用Typescript构建一个大型库,其中包含大约100个单独的ts文件。以前我使用export module XXX(后来改名为export namespace XXX)来导出所有的类,但是正如书中所说,这不是一种推荐的方式,应该使用import代替。

所以我尝试了导入。这很顺利:

import * as mylib from "./source/source.ts";

但是我有100个文件,我不想为每个文件都添加这样一行。而且我希望我的所有类都可以通过mylib变量访问。

所以我尝试了这个:

import * as mylib from "./source/";

但是一旦我这样做,我就会得到:找不到模块 './source/'

有没有一种方法可以用单行导入从一个包含多个文件的文件夹中导入所有类?


你可以将所有这些文件连接起来。这样,你只需要导入一个单一的模块。或者,你可以列出目录中的所有文件 fs.readdir('sources'),然后在 for each 循环中使用 require() 导入它们。 - zoran404
1个回答

43

tsc 提供的两种模块解析策略都不支持这样的行为。你所期望的导入语句

import * as mylib from "./source/";

实际上在做的是按照以下顺序执行检查:

1. (does package.json have a typings key? If so, import this file)
2. import * as mylib from "./source/index.ts";
3. import * as mylib from "./source/index.tsx";
4. import * as mylib from "./source/index.d.ts";

我假设你在这里使用的是Node.js风格的模块解析方式,因为这是推荐的方式。有关在TypeScript中如何进行模块解析的更多细节,请查看TypeScript文档

通常,您想要实现的功能是创建一个index.d.ts文件,该文件作为入口点,从其中导出其余模块。 我以angular2为例: 您的通用angular2导入看起来像这样:

import { Injectable } from '@angular/core'

core是位于@angular目录内的一个目录。就像您的source目录一样。但是,在core目录中有一个index.d.ts文件:

/**
 * @module
 * @description
 * Starting point to import all public core APIs.
 */
export * from './src/metadata';
export * from './src/util';
export * from './src/di';
....

1
谢谢,这个方法很好用!我开始采用这种方法,但又遇到了另一个问题:https://dev59.com/MVoT5IYBdhLWcg3wxx7g 也许你也知道答案 :) - zeroin
1
还有一个相关的问题 - 在我的项目中,我可以导入所有类(使用index.d.ts可能吗?)而不是逐个导入我在类中使用的那些吗?或者这是错误的想法? - zeroin
我认为这不是一个好主意,因为你的webpack/browserify脚本加载器无法检测不同配置的严格源边界。例如,管理模块及其依赖项、公共网站及其依赖项。你总是会下载所有的源代码,即使其中一些在特定页面上没有被使用。 - VadimB
实际上,在Angular 4中,@angular/core内的.d.ts文件被称为core.d.ts,而不是index.d.ts - danwellman
这个限制是否涉及到逻辑业务决策,还是仅仅是性能问题或者没有人完全创建该功能? - Ciel

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接