Skip to content
This repository was archived by the owner on Dec 4, 2017. It is now read-only.

Commit 6813ced

Browse files
thelgevoldwardbell
thelgevold
authored and
wardbell
committed
docs(cookbook - aot compiler) (#2161)
docs(cb-aot-compiler): new cookbook on AoT compiler
1 parent 97736ad commit 6813ced

File tree

14 files changed

+470
-2
lines changed

14 files changed

+470
-2
lines changed

‎public/docs/_examples/cb-aot-compiler/e2e-spec.ts‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
/// <reference path='../_protractor/e2e.d.ts' />
2+
'use strict';
3+
/* tslint:disable:quotemark */
4+
describe('AOT Compilation', function () {
5+
6+
beforeAll(function () {
7+
browser.get('');
8+
});
9+
10+
it('should load page and click button', function (done) {
11+
let headingSelector = element.all(by.css('h1')).get(0);
12+
expect(headingSelector.getText()).toEqual('My First Angular 2 App');
13+
14+
expect(element.all(by.xpath('//div[text()="Magneta"]')).get(0).isPresent()).toBe(true);
15+
expect(element.all(by.xpath('//div[text()="Bombasto"]')).get(0).isPresent()).toBe(true);
16+
expect(element.all(by.xpath('//div[text()="Magma"]')).get(0).isPresent()).toBe(true);
17+
expect(element.all(by.xpath('//div[text()="Tornado"]')).get(0).isPresent()).toBe(true);
18+
19+
let toggleButton = element.all(by.css('button')).get(0);
20+
toggleButton.click().then(function() {
21+
expect(headingSelector.isPresent()).toBe(false);
22+
done();
23+
});
24+
});
25+
});

‎public/docs/_examples/cb-aot-compiler/ts/.gitignore‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
**/*.ngfactory.ts
2+
**/*.metadata.json
3+
dist
4+
!app/tsconfig.json
5+
!rollup.js

‎public/docs/_examples/cb-aot-compiler/ts/app/app.component.html‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
<!-- #docregion -->
2+
<button (click)="toggleHeading()">Toggle Heading</button>
3+
<h1 *ngIf="showHeading">My First Angular 2 App</h1>
4+
5+
<h3>List of Heroes</h3>
6+
<div *ngFor="let hero of heroes">{{hero}}</div>
7+

‎public/docs/_examples/cb-aot-compiler/ts/app/app.component.ts‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
// #docregion
2+
// #docregion
3+
import { Component } from '@angular/core';
4+
5+
@Component({
6+
selector: 'my-app',
7+
templateUrl: 'app.component.html'
8+
})
9+
export class AppComponent {
10+
showHeading = true;
11+
heroes = ['Magneta', 'Bombasto', 'Magma', 'Tornado'];
12+
13+
toggleHeading() {
14+
this.showHeading = !this.showHeading;
15+
}
16+
17+
}

‎public/docs/_examples/cb-aot-compiler/ts/app/app.module.ts‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
// #docregion
2+
import { NgModule } from '@angular/core';
3+
import { BrowserModule } from '@angular/platform-browser';
4+
5+
import { AppComponent } from './app.component';
6+
7+
@NgModule({
8+
imports: [ BrowserModule ],
9+
declarations: [ AppComponent ],
10+
bootstrap: [ AppComponent ]
11+
})
12+
export class AppModule { }

‎public/docs/_examples/cb-aot-compiler/ts/app/main-jit.ts‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
// #docregion
2+
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
3+
4+
import { AppModule } from './app.module';
5+
6+
platformBrowserDynamic().bootstrapModule(AppModule);

‎public/docs/_examples/cb-aot-compiler/ts/app/main.ts‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
// #docregion
2+
import { platformBrowser } from '@angular/platform-browser';
3+
4+
import { AppModuleNgFactory } from '../aot/app/app.module.ngfactory';
5+
6+
platformBrowser().bootstrapModuleFactory(AppModuleNgFactory);

‎public/docs/_examples/cb-aot-compiler/ts/example-config.json‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
{
2+
"build": "build:aot",
3+
"run": "http-server:e2e"
4+
}

‎public/docs/_examples/cb-aot-compiler/ts/index.html‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
<!-- #docregion -->
2+
<!DOCTYPE html>
3+
<html>
4+
<head>
5+
<title>Ahead of time compilation</title>
6+
<meta charset="UTF-8">
7+
<meta name="viewport" content="width=device-width, initial-scale=1">
8+
<link rel="stylesheet" href="styles.css">
9+
10+
<script src="node_modules/core-js/client/shim.min.js"></script>
11+
<script src="node_modules/zone.js/dist/zone.js"></script>
12+
<script src="node_modules/reflect-metadata/Reflect.js"></script>
13+
14+
</head>
15+
16+
<!-- #docregion bundle -->
17+
<body>
18+
<my-app>Loading...</my-app>
19+
</body>
20+
21+
<script src="dist/build.js"></script>
22+
<!-- #enddocregion bundle -->
23+
</html>

‎public/docs/_examples/cb-aot-compiler/ts/rollup.js‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
// #docregion
2+
import rollup from 'rollup'
3+
import nodeResolve from 'rollup-plugin-node-resolve'
4+
import commonjs from 'rollup-plugin-commonjs';
5+
import uglify from 'rollup-plugin-uglify'
6+
7+
// #docregion config
8+
export default {
9+
entry: 'app/main.js',
10+
dest: 'dist/build.js', // output a single application bundle
11+
sourceMap: false,
12+
format: 'iife',
13+
plugins: [
14+
nodeResolve({jsnext: true, module: true}),
15+
// #docregion commonjs
16+
commonjs({
17+
include: 'node_modules/rxjs/**',
18+
}),
19+
// #enddocregion commonjs
20+
// #docregion uglify
21+
uglify()
22+
// #enddocregion uglify
23+
]
24+
}
25+
// #enddocregion config

0 commit comments

Comments
 (0)