Saltar al contenido

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

Ten en cuenta que en las ciencias un error casi siempre tiene varias soluciones, por lo tanto nosotros aquí te enseñaremos la mejor y más eficiente.

Solución:

De la entrada del glosario archivado de Angular.io v2 para 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.

Imagina 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

Cada uno de los paquetes de ámbito angular tiene un barril llamado index.

Consulte también EXCEPCIÓN: no se pueden resolver todos los parámetros


*NOTA:Barrel se ha eliminado de las versiones más recientes del glosario de Angular.

ACTUALIZAR
Con las últimas versiones de Angular, el archivo de barril debe editarse como se muestra a continuación,

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

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

Así que cuando dices import from 'directory_name' buscará index.ts dentro del directorio especificado e importar lo que se exporte allí.

Por ejemplo, si tienes calculator/index.ts como

export function add() ...
export function multiply() ...

Tu puedes hacer

import  add, multiply  from './calculator';

index.ts ayúdenos a mantener todas las cosas relacionadas juntas y no tenemos que 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 vuelven a exportar los cuatro archivos.

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

Recuerda algo, que tienes la capacidad de decir si te fue útil.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)


Tags : /

Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *