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

Question

如果我运行这个：

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是干什么用的？为什么一个组件有一个共享文件夹，如果该组件文件夹只是用于该组件？

Answer 1

共享目录中 index.ts 文件的概念是所谓的桶。

桶装进口的目标。它将导出 shared 中包含的项目以使 blogs.component.ts 中的导入更清洁...

app/components/blogs/shared/blogs.service.ts

export class BlogsService { ... }

app/components/blogs/shared/blog.model.ts

export class Blog { ... }

app/components/blogs/shared/index.ts

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

app/components/blogs/blogs.component.ts

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

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

如果您可以想象，随着您添加更多内容，它会变得更加统一 components/services/directives/models。

REFERENCE 您可以在官方网站上阅读有关桶的信息 style guide（感谢 Günter Zöchbauer）

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

Why does angular-cli create component/shared/index.ts?

angular

shared

angular-cli