diff --git a/public/docs/ts/latest/guide/architecture.jade b/public/docs/ts/latest/guide/architecture.jade index a7d43a7f1f..54b7f07839 100644 --- a/public/docs/ts/latest/guide/architecture.jade +++ b/public/docs/ts/latest/guide/architecture.jade @@ -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.
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=".") diff --git a/public/docs/ts/latest/guide/glossary.jade b/public/docs/ts/latest/guide/glossary.jade index 57b284b973..3f7e5d8af7 100644 --- a/public/docs/ts/latest/guide/glossary.jade +++ b/public/docs/ts/latest/guide/glossary.jade @@ -33,6 +33,23 @@ .l-main-section +: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 @@ -342,6 +376,29 @@ .l-main-section +: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)". + :marked