IT story

모든 index.ts는 무엇에 사용됩니까?

hot-time 2020. 7. 13. 07:59
반응형

모든 index.ts는 무엇에 사용됩니까?


몇 가지 시드 프로젝트를 살펴본 결과 모든 구성 요소에 해당 구성 요소에서 *를 내보내는 index.ts가있는 것 같습니다. 실제로 사용되는 곳을 찾을 수 없습니까?

예 : https://github.com/mgechev/angular2-seed/tree/master/src/client/app/%2Bhome

감사


로부터 Angular.io V2의 보관 용어 에 대한 항목 Barrel* :

배럴은 여러 모듈에서 단일 편의 모듈로 내보내기를 롤업하는 방법입니다. 배럴 자체는 다른 모듈의 선택된 내보내기를 다시 내보내는 모듈 파일입니다.

heroes 폴더에 세 개의 모듈이 있다고 상상해보십시오.

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

다음 항목을 모두 내보내는 heroes 폴더 (일반적으로 색인이라고 함)에 배럴을 추가 할 수 있습니다.

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라는 배럴이 있습니다.

참조 각도 DI 오류 - 예외 : 모든 매개 변수를 확인할 수 없습니다


* 참고 : 최신 버전의 Angular 용어집Barrel 에서 제거되었습니다 .


index.tsindex.jsnodejs 와 비슷 하거나 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';

Here util is folder name not file name which has index.ts which re-export all four files.

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

참고URL : https://stackoverflow.com/questions/37564906/what-are-all-the-index-ts-used-for

반응형