From eee45cff8d6f763d3260d6eee55dd3a945888db9 Mon Sep 17 00:00:00 2001 From: Meligy Date: Thu, 26 Jan 2017 21:43:48 +1100 Subject: [PATCH 1/2] feat(serve): add example of using custom base-href and proxy config The example added supports serving the app via http://localhost:4200/monitoring/ui/ Just run `nom start` to serve the app --- package.json | 3 ++- proxy.conf.json | 8 ++++++++ src/index.html | 2 +- 3 files changed, 11 insertions(+), 2 deletions(-) create mode 100644 proxy.conf.json diff --git a/package.json b/package.json index e473358..f6abe21 100644 --- a/package.json +++ b/package.json @@ -6,7 +6,8 @@ "scripts": { "ng": "ng", "reset": "ng init --routing --style=scss", - "start": "ng serve", + "start": "ng serve -open --proxy=proxy.conf.json", + "build": "ng build -bh \"/monitoring/ui/\"", "lint": "tslint \"src/**/*.ts\" --project src/tsconfig.json --type-check && tslint \"e2e/**/*.ts\" --project e2e/tsconfig.json --type-check", "test": "ng test", "pree2e": "webdriver-manager update --standalone false --gecko false", diff --git a/proxy.conf.json b/proxy.conf.json new file mode 100644 index 0000000..9818066 --- /dev/null +++ b/proxy.conf.json @@ -0,0 +1,8 @@ +{ + "/monitoring/ui/**": { + "target": "http://localhost:4200/", + "pathRewrite": { + "^/monitoring/ui": "" + } + } +} diff --git a/src/index.html b/src/index.html index 1d994cc..b062b44 100644 --- a/src/index.html +++ b/src/index.html @@ -3,7 +3,7 @@ RoutingAngularCli - + From dc498299633ac7f7b4cf6497c0db32450b2decd2 Mon Sep 17 00:00:00 2001 From: Meligy Date: Sun, 29 Jan 2017 23:15:04 +1100 Subject: [PATCH 2/2] feat(app-size): ensure use of forms and http to calculate size properly On Mac size can be show by: ``` ng build --aot -prod --vendor-chunk=false && gzip -f dist/*.js && du -sh dist/*.gz ``` --- src/app/app-routing.module.ts | 4 ++-- src/app/app.module.ts | 4 ++-- .../simple-route/simple-route.component.html | 21 +++++++++++++++++++ .../simple-route/simple-route.component.ts | 17 ++++++++++++++- 4 files changed, 41 insertions(+), 5 deletions(-) diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index 99d24e7..377de21 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -14,10 +14,10 @@ export const routes: Routes = [ }, { path: 'bundled', - loadChildren: loadBundledModule + // loadChildren: loadBundledModule // Comment loadChildren above and uncomment the line below to get non lazy loading working with AoT // Do not delete / comment the `loadBundledModule` declaration or the module will be lazy loaded - // loadChildren: './bundled/bundled.module#BundledModule' + loadChildren: './bundled/bundled.module#BundledModule' }, { path: 'lazy', diff --git a/src/app/app.module.ts b/src/app/app.module.ts index ec12f16..79fc803 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -1,6 +1,6 @@ import { BrowserModule } from '@angular/platform-browser'; import { NgModule } from '@angular/core'; -import { FormsModule } from '@angular/forms'; +import { ReactiveFormsModule } from '@angular/forms'; import { HttpModule } from '@angular/http'; import { AppRoutingModule } from './app-routing.module'; @@ -15,7 +15,7 @@ import { SimpleRouteComponent } from './simple-route/simple-route.component'; ], imports: [ BrowserModule, - FormsModule, + ReactiveFormsModule, HttpModule, AppRoutingModule ], diff --git a/src/app/simple-route/simple-route.component.html b/src/app/simple-route/simple-route.component.html index 667324c..63d4445 100644 --- a/src/app/simple-route/simple-route.component.html +++ b/src/app/simple-route/simple-route.component.html @@ -1,3 +1,24 @@

simple-route works!

+ +
+
+ +
+
+ +
+
+ +
+
+
+ You are now logged in as {{loggedInName}} +
diff --git a/src/app/simple-route/simple-route.component.ts b/src/app/simple-route/simple-route.component.ts index 1bcd80d..9d0f906 100644 --- a/src/app/simple-route/simple-route.component.ts +++ b/src/app/simple-route/simple-route.component.ts @@ -1,4 +1,6 @@ import { Component, OnInit } from '@angular/core'; +import {FormGroup, FormControl} from '@angular/forms'; +import { Http } from '@angular/http'; @Component({ selector: 'app-simple-route', @@ -7,9 +9,22 @@ import { Component, OnInit } from '@angular/core'; }) export class SimpleRouteComponent implements OnInit { - constructor() { } + formGroup = new FormGroup({ + username: new FormControl(''), + password: new FormControl('') + }); + + loggedInName = null; + + constructor(http: Http) { + http.get('/favicon.ico').subscribe(console.log); + } ngOnInit() { } + onLogin(formValue) { + this.loggedInName = formValue.password ? formValue.username : null; + } + }