Remove extraneous barrel at the app root

[johnpapa]

OS?

Mac OSX Sierra

Versions.

angular-cli: 1.0.0-beta.21
node: 6.9.1
os: darwin x64

Repro steps

ng new foo

Details

src/app/foo/index.ts is created and represents a barrel for app.module.ts and app.component.ts

This is referenced from src/app/main.ts

Removing the index.ts file would only require one change in the app:

Before

// main.ts
import { AppModule } from './app/';

After

// main.ts
import { AppModule } from './app/app.module';

Reason:

1. One less file is easier to read.
2. One less concept to learn for the user (barrels)
3. It only used in one place, so it is easy to code without the barrel

[digimax]

yeh you are just going to confuse the daylights out of some N00bz using typescript barrels with reckless abandon, like u decided to do here.

[bhaskerchari]

@johnpapa,

I am totally confused whether to use barrels or not with angular2 ?

I am trying to use barrels the imports does seem to reference properly but when I run the application it doesn't seem to work as intended unless I import them without using any barrels.

Can you please confirm going forward we shouldn't be using any barrels concept? Since even in angular docs I don't see any references to barrels in examples.

As per https://github.com/angular/angular-cli/issues/3231 it says Barrels are no longer part of the style guide and was removed.

Thanks,
Bhasker

[wulfsberg]

Barrels have essentially been superseded by NgModules, which provide the same "one-stop import" for the using code, but also handle Angular-specific things like setting up the needed providers.

[johnpapa]

@bhaskerchari Hi. Barrels help reduce the number of import statements, and can reduce the length of your imports. They do this by consolidating imports into a file (often called a barrel) and then re-exporting them. Thus our code can just import from the barrel, which repoints to the others. Angular does this itself with things like @angular/core.

With the advent of NgModules we have less need for these barrels. Why? Because the ngmodules let us break the app up into functional areas and thus we have fewer need to import across them. It doesn't eliminate the value of barrels, but I feel it does dramatically reduce their value in most Angular 2 apps.

An example of this can be found in my event-view repo on github https://github.com/johnpapa/event-view

I hope this helps clarify a little

[wulfsberg]

Just to add: There shouldn't be any functional difference between importing directly or through a barrel. It is purely a stylistic matter where you want to stack your imports. There is nothing wrong in using them, and they should work.

[bhaskerchari]

Hi @johnpapa ,

Thanks for clarifying that up and it does really makes sense now with the advent of NgModules we have less need for these barrels.

While I do see the advantages with the barrels but there seems to be design problems too with usage of it in a way it creates cyclic dependencies between the different exports in a barrel where one has a dependency on another and makes the exports order non trivial otherwise there is more likely chance of breaking the app with an unintended behaviour.

Maintaining the correct order in barrels can be tricky sometimes especially when you do have lot of exports and can become a painpoint which is what had troubled me.

@wulfsberg Please refer to the below link which I am referring to:
http://stackoverflow.com/questions/37398829/barrel-import-appears-to-break-load-order

Having said all that I am getting rid of barrels from the project that I am going to work on.

Thanks,
Bhasker

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}