Adicionando vários módulos em aplicações Angular 2

Módulor ajudam organizar a aplicação em blocos coesos de funcionalidade. Uma boa parte das bibliotecas internas são módulos (FormsModule, HttpModule, RouterModule) e muitas das bibliotecas de terceiros também estão disponíveis como módulos, tais como Material Design, Ionic (desenvolvimento para dispositivos móveis) e AngularFire2 (backend em tempo real).

Toda aplicação Angular tem pelo menos um módulo, o módulo raiz. O Angular faz o bootstrap desse modulo para dar início a aplicação. No desenvolvimento da aplicação, é opção do programador adicionar componentes, serviços e demais partes ao módulo raiz e ir refatorando em módulos distintos conforme a separação de funcionalidade for ficando clara, ou ir adicionando novos módulos para cada funcionalidade assim que ela é pensada.

Utilizando os mesmos arquivos apresentados na sessão anterior basta aplicar as seguintes alterações para que
a aplicação seja capaz de manipular os dados e fluxos a partir de novos módulos. Os novos arquivos serão
armazenados em uma pasta chamada new que deverá ser persistida no diretório src/app

app.new.module.ts

import { NgModule } from '@angular/core';
import { AppNewComponent } from './app.new.component';
@NgModule({
    imports: [
    ],
    declarations: [
        AppNewComponent
    ],
    exports: [ AppNewComponent ]
})
export class AppNewModule { }

app.new.component.ts

import { Component } from '@angular/core';
@Component({
    selector: 'new-module',
    template: `<p>Texto do novo componente é {{texto}}</p>`
})

export class AppNewComponent {
    texto:string = "Um texto";
}

O arquivo app.module.ts deve ser alterado para incluir o arquivo app.new.module.ts conforme apresentado
a seguir:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { AppNewModule } from './new/app.new.module';
@NgModule({
    imports: [BrowserModule, AppNewModule],
    declarations: [AppComponent],
    bootstrap: [ AppComponent ]
})
export class AppModule { }

Basta compilar com tsc, realizar a conversão do javascript com browserify e copiar o arquivo bundle.js
para o diretório do servidor http.

tsc
cd js
browserify main.js -o bundle.js
cd ..
cp js/bundle.js /var/www/html/angular2