为什么angular-cli会创建component / shared / index.ts?

时间:2016-06-07 14:39:16

标签: angular shared angular-cli

如果我这样做:

ng g component components/blogs

我得到了

app
+--components
| +--blogs
| |  +--shared
| |  |  +--index.ts              // what's this for?
| |  +--blogs.component.css
| |  +--blogs.component.html
| |  +--blogs.component.ts
| |  +--blogs.component.spec.ts  // unit tests!
| |  +--index.ts

我了解其余部分,但/blogs/shared/index.ts是什么?如果组件文件夹仅用于组件,为什么组件具有共享文件夹?

1 个答案:

答案 0 :(得分:18)

共享目录中index.ts文件的想法叫做桶。

它的目标是巩固进口。它将导出共享中包含的项目,以使blogs.component.ts中的导入更清晰......

应用/组件/博客/共享/ blogs.service.ts

export class BlogsService { ... }

应用/组件/博客/共享/ blog.model.ts

export class Blog { ... }

应用/组件/博客/共享/ index.ts

export * from './blogs.service';
export * from './blog.model';

应用/组件/博客/ blogs.component.ts

// without barrel
import { BlogsSerivce } from './shared/blogs.service';
import { Blog } from './shared/blog.model';

// with barrel
import { BlogService, Blog } from './shared';

如果您可以想象,当您添加更多组件/服务/指令/模型时,这会变得更加整合。

REFERENCE 您可以在官方style guide中阅读有关桶的信息(感谢GünterZöchbauer)