我一直在看一些种子项目,所有组件似乎都有一个 index.ts 从该组件导出 * 。我在任何地方都找不到它的实际用途?
例如https://github.com/mgechev/angular2-seed/tree/master/src/client/app/%2Bhome
谢谢
从Angular.io v2 的Barrel*存档词汇表条目中:
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 的桶。
桶是一种将多个模块的导出汇总到单个便利模块的方法。桶本身是一个模块文件,它重新导出其他模块的选定导出。
想象一下 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';