2

I am looking for creating a global import file instead of importing the same libraries in each component (same import in each component).

I have seen index.ts file here which includes the import references of file like component and service. but i am looking for a solution by which i can import following references in one file and then i must be able to import single file to my components instead of all the following references.

// Observable class extensions
export * from 'rxjs/add/observable/of';

// Observable operators
export * from 'rxjs/add/operator/catch';
export * from 'rxjs/add/operator/debounceTime';
export * from 'rxjs/add/operator/distinctUntilChanged';

export { Component, OnInit } from '@angular/core';
export { Http, Response, Headers } from '@angular/http';
export * from 'rxjs/add/operator/map';

Please help, i am new in angular 2 and could not find any help in this regard.

n00dl3
  • 21,213
  • 7
  • 66
  • 76
Salman Lone
  • 1,526
  • 2
  • 22
  • 29
  • I'm affraid the barrel file (`export * from "some-lib"`) is the only way... – n00dl3 Apr 05 '17 at 07:25
  • the only thing that I know (apart from `barrel`) is regarding the `rxjs` operators...you can create a file with all this `rxjs/add/` and then just import the file you created in your component and you'll be able to use all methods without import each of `rxjs` operator. – Elmer Dantas Apr 05 '17 at 07:32
  • I have achieved the above thing by creating a new ts file with name 'xyz' and then import that file into my component. import { Component, OnInit } from ../xyz But what will be the impact, will it load all the export libraries mentioned in the file? or it will only call the mentioned file in import statement? – Salman Lone Apr 05 '17 at 07:33
  • I don't know for sure but, as we are talking about script, I think it will load all the exports. – Elmer Dantas Apr 05 '17 at 07:35
  • that means it will impact the performance of the app? if it is not necessary to have all the mentioned libraries and only need one of them. – Salman Lone Apr 05 '17 at 07:36
  • I'm afraid so. But I'm not a specialist in angular loading modules and performance. Maybe you need to take a further research about this or do yourself a performance test with your app using the solution you want and using the "regular way" to build an app. and see the difference. – Elmer Dantas Apr 05 '17 at 07:46
  • http://stackoverflow.com/questions/43224905/impact-of-global-import-file-in-angular-2/43224962#43224962 – Salman Lone Apr 05 '17 at 08:02

1 Answers1

0

I have achieved the above thing by creating a new ts file with name 'xyz' and then import that file into my component. the 'xyz' contains all the references.

import { Component, OnInit } from './xyz'

but after R&D, i got to know that this is not the best practice. details are in this link.

Community
  • 1
  • 1
Salman Lone
  • 1,526
  • 2
  • 22
  • 29