curso - angular wikipedia

¿Para qué se usan todos los index.ts?

Question

He estado mirando algunos proyectos semilla y todos los componentes parecen tener un index.ts que exporta * desde ese componente. ¿No puedo encontrar en ninguna parte para qué se usa realmente?

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

Gracias

Answer 1

Desde https://angular.io/docs/ts/latest/guide/glossary.html Barrel

Un barril es una forma de acumular exportaciones de varios módulos en un solo módulo de conveniencia. El barril en sí es un archivo de módulo que reexporta exportaciones seleccionadas de otros módulos.

Imagine tres módulos en una carpeta de héroes:

// heroes/hero.component.ts
export class HeroComponent {}

// heroes/hero.model.ts
export class Hero {}

// heroes/hero.service.ts
export class HeroService {}

Sin un barril, un consumidor necesitaría tres declaraciones de importación:

import { HeroComponent } from ''../heroes/hero.component.ts'';
import { Hero }          from ''../heroes/hero.model.ts'';
import { HeroService }   from ''../heroes/hero.service.ts'';

Podemos agregar un barril a la carpeta de héroes (llamado índice por convención) que exporta todos estos elementos:

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

Ahora un consumidor puede importar lo que necesita del barril.

import { Hero, HeroService } from ''../heroes''; // index is implied

Los paquetes de ámbito angular tienen un barril llamado índice.

Ver también Angular 2 DI Error - EXCEPCIÓN: No se pueden resolver todos los parámetros

Answer 2

index.ts es similar index.js en nodejs o index.html es alojamiento de sitios web.

Entonces, cuando diga import {} from ''directory_name'' index.ts import {} from ''directory_name'' buscará index.ts dentro del directorio especificado e importará lo que se exporte allí.

Por ejemplo, si tiene calculator/index.ts como

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

Tu puedes hacer

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

Answer 3

index.ts nos ayuda a mantener todo lo relacionado y no necesitamos preocuparnos por el nombre del archivo fuente.

Podemos importar todo usando el nombre de la carpeta de origen.

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

Aquí util es el nombre de la carpeta, no el nombre del archivo que tiene index.ts que reexporta los cuatro archivos.

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