Angular - Use a Barrel File for all Component Imports

Question

I am currently on Angular 5.

I have created a barrel file for all the common imports I use in my component files. The question that I have is - is this a good idea or bad idea in regards to lazy loading, tree shaking, or anything else I didn't think of such as AOT? Or is this approach completely fine and won't affect load time or anything else negatively. If you could shine some light on the reason too that would be appreciated.

Examples:

  common-component-imports.ts:
    export { AppState, Event, EventPriority, EventType, Page, Unit, User, WindowSettings } from '../models/index';
    export { Component, ElementRef, Input, ViewChild, ViewChildren } from '@angular/core';
    export { Config, IonicPage, Loading, LoadingController, Modal, ModalController, Nav, NavController, NavParams, Platform, Toast, ToastController, ViewController } from 'ionic-angular';
etc../

and than in my components I am doing this:

event.ts
import {
  Component,
  ElectronService,
  Event,
  AppState,
  IonicPage,
  NavController,
  NavParams,
  Store,
 } from '../shared/common-component-imports';

and I import like that on several more files besides just event.ts.

Answer 1

Barrels are a good idea in general but have no impact on lazy loading. https://angular.io/guide/glossary#barrel (barrel has been removed from the glossary 2018)

UPDATE: "Consider creating a "barrel" file that gathers all the interceptor providers into an httpInterceptorProviders array, starting with this first one, the NoopInterceptor." https://angular.io/guide/http

Style Guide" with NgModules (2016-09-27) "StyleGuide explains recommended conventions for NgModules. Barrels now are far less useful and have been removed from the style guide; they remain valuable but are not a matter of Angular style. Also relaxed the rule that discouraged use of the @Component.host property." https://angular.io/guide/change-log