小编典典

所有 index.ts 的用途是什么?

all

我一直在看一些种子项目,所有组件似乎都有一个 index.ts 从该组件导出 * 。我在任何地方都找不到它的实际用途?

例如https://github.com/mgechev/angular2-seed/tree/master/src/client/app/%2Bhome

谢谢


阅读 145

收藏
2022-08-21

共1个答案

小编典典

Angular.io v2
Barrel*存档词汇表条目中:

桶是一种将多个模块的导出汇总到单个便利模块的方法。桶本身是一个模块文件,它重新导出其他模块的选定导出。

想象一下 heros 文件夹中的三个模块:

// heroes/hero.component.ts
export class HeroComponent {}

// heroes/hero.model.ts
export class Hero {}

// heroes/hero.service.ts
export class HeroService {}

如果没有桶,消费者将需要三个导入语句:

import { HeroComponent } from '../heroes/hero.component.ts';
import { Hero }          from '../heroes/hero.model.ts';
import { HeroService }   from '../heroes/hero.service.ts';

我们可以在 heros 文件夹中添加一个桶(按惯例称为 index),它可以导出所有这些项目:

export * from './hero.model.ts';   // re-export all of its exports
export * from './hero.service.ts'; // re-export all of its exports
export { HeroComponent } from './hero.component.ts'; // re-export the

named thing

现在消费者可以从桶中进口它需要的东西。

import { Hero, HeroService } from '../heroes'; // index is implied

每个 Angular 范围包都有一个名为 index 的桶。

另请参阅例外:无法解析所有参数


更新 使用最新版本的 Angular,桶文件应编辑如下,

export { HeroModel } from './hero.model';  
export { HeroService } from './hero.service';
export { HeroComponent } from './hero.component';
2022-08-21