programing

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

easyjava 2023. 5. 4. 20:43
반응형

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

각 범위 패키지에는 인덱스라는 이름의 배럴이 있습니다.

참고 항목예외: 일부 매개 변수를 확인할 없음


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

업데이트 Angular의 최신 버전으로 배럴 파일을 아래와 같이 편집해야 합니다.

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

index.ts유사함index.jsnodejsor에.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파일 4개를 모두 다시 내보냅니다.

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

index.ts는 일반적으로 내부 폴더 외부에 위치합니다.예:

my-app/
├─ src/
│  ├─ internal/
│  │  ├─ app.ts
│  ├─ index.ts

다음과 같이 가정/src/internal/app.ts우리는 모든 기능을 가져오기를 원합니다. 예를 들어, A 기능.

만약 우리가 없다면.index.ts우리가 생각하는 바로는export * from ./internal/app.ts외부에서 A 함수를 가져올 때, 우리의 경로는 내부 폴더 안으로 곧장 들어갑니다.

import {A} from ./src/internal/app

이것은 가능한 한 피해야 합니다.

사용할 경우index.ts우리의 길은 단순합니다.

import {A} from ./src

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

반응형