index.ts ทั้งหมดใช้ทำอะไร?

ฉันได้ดูโครงการเมล็ดพันธุ์สองสามโครงการและส่วนประกอบทั้งหมดดูเหมือนจะมี index.ts ที่ส่งออก * จากส่วนประกอบนั้น ฉันไม่พบสิ่งที่ใช้จริง?

เช่นhttps://github.com/mgechev/angular2-seed/tree/master/src/client/app/%2Bhome

ขอบคุณ

จากรายการอภิธานศัพท์ที่เก็บถาวรของ Angular.io v2สำหรับBarrel^* :

บาร์เรลเป็นวิธีการรวบรวมการส่งออกจากหลายโมดูลไปยังโมดูลอำนวยความสะดวกเดียว ตัวถังเป็นไฟล์โมดูลที่ส่งออกการส่งออกที่เลือกของโมดูลอื่นอีกครั้ง

ลองนึกภาพสามโมดูลในโฟลเดอร์ฮีโร่:

// 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';

เราสามารถเพิ่มบาร์เรลในโฟลเดอร์ฮีโร่ (เรียกว่าดัชนีตามแบบแผน) ที่ส่งออกรายการเหล่านี้ทั้งหมด:

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

แพ็คเกจที่กำหนดขอบเขตเชิงมุมแต่ละชุดมีดัชนีชื่อถัง

ดูเพิ่มเติมที่EXCEPTION: ไม่สามารถแก้ไขพารามิเตอร์ทั้งหมด

^* หมายเหตุ: Barrelถูกลบออกจากรุ่นล่าสุดของคำศัพท์เชิงมุม

อัปเดต ด้วย Angular เวอร์ชันล่าสุดไฟล์บาร์เรลควรได้รับการแก้ไขดังต่อไปนี้

export { HeroModel } from './hero.model';  
export { HeroService } from './hero.service'; 
export { HeroComponent } from './hero.component';

index.tsมีความคล้ายคลึงกันindex.jsใน nodejs หรือindex.htmlเป็นเว็บโฮสติ้ง

ดังนั้นเมื่อคุณบอกว่าimport {} from 'directory_name'จะค้นหาindex.tsภายในไดเร็กทอรีที่ระบุและนำเข้าสิ่งที่ส่งออกที่นั่น

ตัวอย่างเช่นถ้าคุณมีcalculator/index.tsเป็น

export function add() {...}
export function multiply() {...}

คุณทำได้

import { add, multiply } from './calculator';

index.ts ช่วยให้เรารวบรวมสิ่งที่เกี่ยวข้องทั้งหมดไว้ด้วยกันและเราไม่จำเป็นต้องกังวลเกี่ยวกับชื่อไฟล์ต้นฉบับ

เราสามารถนำเข้าทุกสิ่งโดยใช้ชื่อโฟลเดอร์ต้นทาง

import { getName, getAnyThing } from './util';

ที่นี่ util คือชื่อโฟลเดอร์ไม่ใช่ชื่อไฟล์ซึ่งมีindex.tsการส่งออกไฟล์ทั้งสี่ใหม่อีกครั้ง

export * from './util1';
export * from './util2';
export * from './util3';
export * from './util4';