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

标签 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 是干什么用的?如果组件文件夹仅供组件使用,为什么组件会有共享文件夹?

最佳答案

共享目录中的 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';

如果您能想象的话,随着您添加更多组件/服务/指令/模型,这会变得更加统一。

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

关于angular - 为什么 angular-cli 会创建 component/shared/index.ts?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37682372/

相关文章:

angular - 无法找到元素的可测试性 - Protractor

angular - setTimeout 里面的变量说它是未定义的,但是当它在外面时它被定义了

angular - 将数据从一个组件传递到另一个组件并反射(reflect)在 View 中

angular - 在 Angular 4/5 和 TypeScript 中重新加载同一页面

laravel - 在本地存储图像 vs cloudinary vs s3

angular - 如何处理构建 "dist"文件夹

Angular Cli 'ng g c my-new-component' 错误 : Could not find (undefined) and Could not find (undefined)

Angular-cli:将 less 文件编译为全局 css

linux - g++ -shared -fPIC helloworld.cpp -o ./hw, 核心转储

创建/初始化共享内存中的对象(由mmap()打开)