docs(architecture/glossary): describe modules,barrels, and bundles; refer to doc

closes #547
This commit is contained in:
Ward Bell 2015-12-15 16:52:16 -08:00
parent 052d5ec8fe
commit 5de77b7225
2 changed files with 64 additions and 3 deletions

View File

@ -77,14 +77,18 @@ figure
:marked
Some modules are libraries of other modules.
Angular itself ships as a collection of library modules.
Each Angular library is actually a facade over several feature modules that belong together as a group.
Angular itself ships as a collection of library modules called "barrels".
Each Angular library is actually a public facade over several logically related private modules.
The `angular2/core` library is the primary Angular library module from which we get most of what we need.
<br clear="all">
There are other important Angular library modules too such as `angular2/common`, `angular2/router`, and `angular2/http`.
.l-sub-section
:marked
Learn more about how Angular organizes and distributes modules
in "[Modules, barrels and bundles](https://github.com/angular/angular/blob/master/modules/angular2/docs/bundles/overview.md)".
:marked
We import what we need from an Angular library module in much the same way.
For example, we import the Angular **`Component` *function*** from the *angular2/core* module like this:
+makeExample('architecture/ts/app/app.component.ts', 'import')(format=".")

View File

@ -33,6 +33,23 @@
.l-main-section
<a id="B"></a>
:marked
## Barrel
.l-sub-section
:marked
A **barrel** is an Angular library module consisting of a logical grouping of single-purpose modules
such as `Component` and `Directive`.
Familiar barrels include `angular2/core`, `angular2/common`, `angular2/platform/browser`,
`angular2/http`, and `angular2/router`.
Barrels are packaged and shipped as [**bundles**](#bundle) that
we may load with script tags in our `index.html`.
The script, `angular2.dev.js`, is a bundle.
Learn more in "[Modules, barrels and bundles](https://github.com/angular/angular/blob/master/modules/angular2/docs/bundles/overview.md)".
:marked
## Binding
.l-sub-section
@ -55,6 +72,23 @@
One can bootstrap multiple apps in the same `index.html`, each with its own top level root.
:marked
## Bundle
.l-sub-section
:marked
Angular JavaScript libraries are shipped in **bundles** within an **npm package**
such as [angular2](https://www.npmjs.com/package/angular2).
The scripts `angular2.dev.js`, `http.js`, `router.js`, and `Rx.js` are
familiar examples of bundles.
A bundle contains one more more [**barrels**](#barrel)
and each barrel contains a collection of logically related [modules](#module)
Familiar barrels include `angular2/core`, `angular2/common`, `angular2/platform/browser`,
`angular2/http`, `angular2/router`.
Learn more in "[Modules, barrels and bundles](https://github.com/angular/angular/blob/master/modules/angular2/docs/bundles/overview.md)".
.l-main-section
<a id="C"></a>
@ -342,6 +376,29 @@
.l-main-section
<a id="M"></a>
:marked
## Module
.l-sub-section
:marked
Angular apps are modular.
In general we assemble our application from many modules both the ones we write ourselves
and the ones we acquire from others.
A typical module is a cohesive block of code dedicated to a single purpose.
A module exports something of value in that code, typically one thing such as a class.
Modules are typically named after the file in which the exported thing is defined.
The Angular [DatePipe](https://github.com/angular/angular/blob/master/modules/angular2/src/common/pipes/date_pipe.ts)
class belongs to a module named `date_pipe` in the file `date_pipe.ts`.
In general, Angular feature modules such as the `data_pipe` are not exposed directly.
Rather they are grouped together with logically related modules in public-facing **library modules**
called [**barrels**](#barrel).
Learn more in "[Modules, barrels and bundles](https://github.com/angular/angular/blob/master/modules/angular2/docs/bundles/overview.md)".
<a id="N"></a>
<a id="O"></a>
:marked