From 3789db81cd5278b5ca10c89e9fa8d4fa8579ce9b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Martin=20Kope=C4=8Dek?= <github@smallhill.cz>
Date: Tue, 29 Nov 2016 10:42:21 +0100
Subject: [PATCH 1/2] Add "how to use with AoT"

---
 README.md | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 69a749cbee..5911345268 100644
--- a/README.md
+++ b/README.md
@@ -42,7 +42,9 @@ You will need bootstrap styles
  - `system.js` (and [angular2 quickstart](https://angular.io/docs/ts/latest/quickstart.html)) please checkout [sample repository](https://github.com/valor-software/angular2-quickstart) 
  - `webpack` you can view our demo page [source code](https://github.com/valor-software/ng2-bootstrap/tree/development/demo)
  - `plnkr` sample available [here](http://bit.ly/ng2-bootstrap-plnkr)
-
+ - `AoT using ngc and rollup` please refer to [ng2-bootstrap-with-aot](https://github.com/valor-software/ng2-bootstrap/tree/development/docs/getting-started/aot.md)
+ + - `AoT using ngc and rollup` please refer to [ng2-bootstrap-with-aot](https://github.com/valor-software/ng2-bootstrap/tree/development/docs/getting-started/aot.md)
++ 
 # Usage & Demo
 
 Main source of API documentation and usage scenarious available here: 

From 6daf92a6439c794f136eeebd414e03733aec4da9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Martin=20Kope=C4=8Dek?= <github@smallhill.cz>
Date: Tue, 29 Nov 2016 11:02:05 +0100
Subject: [PATCH 2/2] Add "howto use with AoT"

---
 docs/getting-started/aot.md | 79 +++++++++++++++++++++++++++++++++++++
 1 file changed, 79 insertions(+)
 create mode 100644 docs/getting-started/aot.md

diff --git a/docs/getting-started/aot.md b/docs/getting-started/aot.md
new file mode 100644
index 0000000000..4d43e2d442
--- /dev/null
+++ b/docs/getting-started/aot.md
@@ -0,0 +1,79 @@
+### How to use ng2-bootstrap in Angular2 with AoT compilation using ngc and rollup
+
+The compilation process is described on the official Angular2 website here: https://angular.io/docs/ts/latest/cookbook/aot-compiler.html
+
+Note that you also have to include bootstrap CSS from the official Bootrstrap site or Bootstrap CDN in your index.html HEAD section.
+ 
+#### 1) Install `ng2-bootstrap`
+
+```bash
+npm install ng2-bootstrap bootstrap --save
+```
+ 
+#### 2) Edit Angular 2 module
+
+Open the module file where you want to include ng2-bootstrap (most probably `app.module.ts`) and import either specific ng2-bootstrap modules by listing them in the import statement and then in the import array of the Angular 2 module
+
+```typescript
+import { AlertModule, ModalModule } from 'ng2-bootstrap/ng2-bootstrap';
+...
+
+@NgModule({
+   ...
+   imports: [AlertModule, ModalModule, ... ],
+   ... 
+})
+```
+
+ or use Ng2BootstrapModule to import all of the modules at once:
+
+```typescript
+import { Ng2BootstrapModule } from 'ng2-bootstrap/ng2-bootstrap';
+...
+
+@NgModule({
+   ...
+   imports: [Ng2BootstrapModule, ... ],
+   ... 
+})
+```
+
+#### 3) Edit rollup configuration (rollup-config.js)
+
+You have to use CommonJS rollup plugin, which you should be using anyway due to RxJS. If for some reason not, install it:
+
+```bash
+npm install rollup-plugin-commonjs --save --dev
+```
+
+Then you have to import the CommonJS plugin, include it in the plugins array and add ng2-bootstrap to the list of modules:
+
+```javascript
+...
+import commonjs from 'rollup-plugin-commonjs';
+...
+
+//paths are relative to the execution path
+export default {
+	...
+	plugins: [
+		...
+		commonjs({
+			include: [
+				'node_modules/rxjs/**',
+				'node_modules/ng2-bootstrap/**'
+			]
+		}),
+		...
+	]
+}
+```
+
+#### 4) Run compilation the standard way
+
+e.g.
+
+```bash
+ngc -p tsconfig-aot.json
+rollup -c rollup-config.js
+```