From 4ec1736f1842f9fdf9dd85b37f73565df918ada0 Mon Sep 17 00:00:00 2001
From: Filipe Silva <filipematossilva@gmail.com>
Date: Wed, 4 Jan 2017 18:56:49 +0000
Subject: [PATCH] chore: convert relative templateUrl/styleUrls to have ./

---
 .../_examples/animations/ts/app/hero-list-auto.component.ts   | 2 +-
 .../_examples/animations/ts/app/hero-list-basic.component.ts  | 2 +-
 .../ts/app/hero-list-combined-transitions.component.ts        | 2 +-
 .../ts/app/hero-list-enter-leave-states.component.ts          | 2 +-
 .../animations/ts/app/hero-list-enter-leave.component.ts      | 2 +-
 .../_examples/animations/ts/app/hero-list-groups.component.ts | 2 +-
 .../animations/ts/app/hero-list-inline-styles.component.ts    | 2 +-
 .../animations/ts/app/hero-list-multistep.component.ts        | 2 +-
 .../animations/ts/app/hero-list-timings.component.ts          | 2 +-
 .../_examples/animations/ts/app/hero-list-twoway.component.ts | 2 +-
 .../_examples/architecture/ts/app/hero-detail.component.ts    | 2 +-
 .../docs/_examples/architecture/ts/app/hero-list.component.ts | 2 +-
 .../_examples/attribute-directives/ts/app/app.component.1.ts  | 2 +-
 .../_examples/attribute-directives/ts/app/app.component.ts    | 2 +-
 .../cb-a1-a2-quick-reference/ts/app/app.component.ts          | 4 ++--
 .../cb-a1-a2-quick-reference/ts/app/movie-list.component.ts   | 4 ++--
 public/docs/_examples/cb-aot-compiler/ts/app/app.component.ts | 2 +-
 .../cb-component-communication/ts/app/app.component.ts        | 2 +-
 .../cb-component-relative-paths/ts/app/some.component.ts      | 4 ++--
 .../_examples/cb-dependency-injection/ts/app/app.component.ts | 2 +-
 .../cb-dynamic-form/ts/app/dynamic-form-question.component.ts | 2 +-
 .../cb-dynamic-form/ts/app/dynamic-form.component.ts          | 2 +-
 .../ts/app/reactive/hero-form-reactive.component.ts           | 2 +-
 .../ts/app/template/hero-form-template1.component.ts          | 2 +-
 .../ts/app/template/hero-form-template2.component.ts          | 2 +-
 public/docs/_examples/cb-i18n/ts/app/app.component.ts         | 2 +-
 .../cb-ts-to-js/js-es6-decorators/app/app.component.es6       | 2 +-
 .../cb-ts-to-js/js-es6-decorators/app/confirm.component.es6   | 2 +-
 .../js-es6-decorators/app/hero-title.component.es6            | 2 +-
 .../docs/_examples/cb-ts-to-js/js-es6/app/app.component.es6   | 2 +-
 .../_examples/cb-ts-to-js/js-es6/app/confirm.component.es6    | 2 +-
 .../_examples/cb-ts-to-js/js-es6/app/hero-title.component.es6 | 2 +-
 public/docs/_examples/cb-ts-to-js/ts/app/app.component.ts     | 2 +-
 public/docs/_examples/cb-ts-to-js/ts/app/confirm.component.ts | 2 +-
 .../docs/_examples/cb-ts-to-js/ts/app/hero-title.component.ts | 2 +-
 .../cli-quickstart/ts/src/app/cli-quickstart.component.ts     | 4 ++--
 .../component-styles/ts/app/quest-summary.component.ts        | 4 ++--
 public/docs/_examples/forms/ts/app/hero-form.component.ts     | 2 +-
 .../docs/_examples/homepage-hello-world/ts/app/hello_world.ts | 2 +-
 public/docs/_examples/lifecycle-hooks/ts/app/app.component.ts | 2 +-
 .../_examples/lifecycle-hooks/ts/app/do-check.component.ts    | 2 +-
 .../_examples/lifecycle-hooks/ts/app/on-changes.component.ts  | 2 +-
 public/docs/_examples/lifecycle-hooks/ts/app/spy.component.ts | 2 +-
 .../_examples/ngmodule/ts/app/contact/contact.component.3.ts  | 4 ++--
 .../_examples/ngmodule/ts/app/contact/contact.component.ts    | 4 ++--
 public/docs/_examples/ngmodule/ts/app/core/title.component.ts | 2 +-
 public/docs/_examples/ngmodule/ts/app/title.component.ts      | 2 +-
 public/docs/_examples/pipes/ts/app/app.component.ts           | 2 +-
 public/docs/_examples/pipes/ts/app/flying-heroes.component.ts | 4 ++--
 .../docs/_examples/router/ts/app/compose-message.component.ts | 2 +-
 .../_examples/security/ts/app/bypass-security.component.ts    | 2 +-
 .../_examples/security/ts/app/inner-html-binding.component.ts | 2 +-
 .../ts/app/toh/hero-list.component.promise.ts                 | 2 +-
 .../server-communication/ts/app/toh/hero-list.component.ts    | 2 +-
 .../server-communication/ts/app/wiki/wiki-smart.component.ts  | 2 +-
 .../ts/app/structural-directives.component.ts                 | 2 +-
 .../docs/_examples/style-guide/ts/01-01/app/app.component.ts  | 2 +-
 .../docs/_examples/style-guide/ts/03-06/app/app.component.ts  | 2 +-
 .../style-guide/ts/04-08/app/heroes/heroes.component.ts       | 2 +-
 .../style-guide/ts/04-10/app/heroes/heroes.component.ts       | 2 +-
 .../style-guide/ts/04-11/app/core/nav/nav.component.ts        | 4 ++--
 .../ts/04-11/app/core/spinner/spinner.component.ts            | 4 ++--
 .../style-guide/ts/04-11/app/heroes/heroes.component.ts       | 2 +-
 .../style-guide/ts/04-12/app/core/nav/nav.component.ts        | 4 ++--
 .../style-guide/ts/04-12/app/heroes/heroes.component.ts       | 2 +-
 .../docs/_examples/style-guide/ts/05-02/app/app.component.ts  | 2 +-
 .../heroes/shared/hero-button/hero-button.component.avoid.ts  | 2 +-
 .../app/heroes/shared/hero-button/hero-button.component.ts    | 2 +-
 .../docs/_examples/style-guide/ts/05-03/app/app.component.ts  | 2 +-
 .../heroes/shared/hero-button/hero-button.component.avoid.ts  | 2 +-
 .../app/heroes/shared/hero-button/hero-button.component.ts    | 2 +-
 .../style-guide/ts/05-04/app/heroes/heroes.component.ts       | 4 ++--
 .../docs/_examples/style-guide/ts/05-13/app/app.component.ts  | 2 +-
 .../docs/_examples/style-guide/ts/05-16/app/app.component.ts  | 2 +-
 .../docs/_examples/style-guide/ts/06-01/app/app.component.ts  | 2 +-
 .../docs/_examples/style-guide/ts/07-01/app/app.component.ts  | 2 +-
 public/docs/_examples/style-guide/ts/app/app.component.ts     | 2 +-
 public/docs/_examples/template-syntax/ts/app/app.component.ts | 2 +-
 public/docs/_examples/testing/ts/app/app.component.ts         | 2 +-
 public/docs/_examples/testing/ts/app/bag/bag.ts               | 4 ++--
 public/docs/_examples/testing/ts/app/banner.component.ts      | 4 ++--
 .../testing/ts/app/dashboard/dashboard-hero.component.ts      | 4 ++--
 .../_examples/testing/ts/app/dashboard/dashboard.component.ts | 4 ++--
 .../_examples/testing/ts/app/hero/hero-detail.component.ts    | 4 ++--
 .../docs/_examples/testing/ts/app/hero/hero-list.component.ts | 4 ++--
 public/docs/_examples/toh-5/ts/app/app.component.ts           | 2 +-
 public/docs/_examples/toh-5/ts/app/dashboard.component.ts     | 4 ++--
 public/docs/_examples/toh-5/ts/app/hero-detail.component.ts   | 4 ++--
 public/docs/_examples/toh-5/ts/app/heroes.component.ts        | 4 ++--
 public/docs/_examples/toh-6/ts/app/app.component.ts           | 2 +-
 public/docs/_examples/toh-6/ts/app/dashboard.component.ts     | 4 ++--
 public/docs/_examples/toh-6/ts/app/hero-detail.component.ts   | 4 ++--
 public/docs/_examples/toh-6/ts/app/hero-search.component.ts   | 4 ++--
 public/docs/_examples/toh-6/ts/app/heroes.component.ts        | 4 ++--
 .../ts/app/phone-detail/phone-detail.component.ts             | 2 +-
 .../ts/app/phone-detail/phone-detail.component.ts             | 2 +-
 .../ts/app/phone-list/phone-list.component.ts                 | 2 +-
 public/docs/_examples/user-input/ts/app/app.component.ts      | 2 +-
 public/docs/ts/latest/cookbook/component-relative-paths.jade  | 3 ++-
 public/docs/ts/latest/cookbook/ts-to-js.jade                  | 2 +-
 100 files changed, 126 insertions(+), 125 deletions(-)

diff --git a/public/docs/_examples/animations/ts/app/hero-list-auto.component.ts b/public/docs/_examples/animations/ts/app/hero-list-auto.component.ts
index 39d69f2c91..df7280d3ea 100644
--- a/public/docs/_examples/animations/ts/app/hero-list-auto.component.ts
+++ b/public/docs/_examples/animations/ts/app/hero-list-auto.component.ts
@@ -23,7 +23,7 @@ import { Heroes } from './hero.service';
     </ul>
   `,
   // #enddocregion template
-  styleUrls: ['hero-list.component.css'],
+  styleUrls: ['./hero-list.component.css'],
 
   /* When the element leaves (transition "in => void" occurs),
    * get the element's current computed height and animate
diff --git a/public/docs/_examples/animations/ts/app/hero-list-basic.component.ts b/public/docs/_examples/animations/ts/app/hero-list-basic.component.ts
index c74ef90b8b..a40f9ade94 100644
--- a/public/docs/_examples/animations/ts/app/hero-list-basic.component.ts
+++ b/public/docs/_examples/animations/ts/app/hero-list-basic.component.ts
@@ -34,7 +34,7 @@ import { Heroes } from './hero.service';
     </ul>
   `,
   // #enddocregion template
-  styleUrls: ['hero-list.component.css'],
+  styleUrls: ['./hero-list.component.css'],
   // #enddocregion
   /**
    * Define two states, "inactive" and "active", and the end
diff --git a/public/docs/_examples/animations/ts/app/hero-list-combined-transitions.component.ts b/public/docs/_examples/animations/ts/app/hero-list-combined-transitions.component.ts
index 7fe59f9ab9..b40a0c3514 100644
--- a/public/docs/_examples/animations/ts/app/hero-list-combined-transitions.component.ts
+++ b/public/docs/_examples/animations/ts/app/hero-list-combined-transitions.component.ts
@@ -27,7 +27,7 @@ import { Heroes } from './hero.service';
    </ul>
  `,
  // #enddocregion template
- styleUrls: ['hero-list.component.css'],
+ styleUrls: ['./hero-list.component.css'],
  /*
   * Define two states, "inactive" and "active", and the end
   * styles that apply whenever the element is in those states.
diff --git a/public/docs/_examples/animations/ts/app/hero-list-enter-leave-states.component.ts b/public/docs/_examples/animations/ts/app/hero-list-enter-leave-states.component.ts
index 6e6fe6cd3f..a88e08f251 100644
--- a/public/docs/_examples/animations/ts/app/hero-list-enter-leave-states.component.ts
+++ b/public/docs/_examples/animations/ts/app/hero-list-enter-leave-states.component.ts
@@ -24,7 +24,7 @@ import { Heroes } from './hero.service';
     </ul>
   `,
   // #enddocregion template
-  styleUrls: ['hero-list.component.css'],
+  styleUrls: ['./hero-list.component.css'],
   /* The elements here have two possible states based
    * on the hero state, "active", or "inactive". We animate
    * six transitions: Between the two states in both directions,
diff --git a/public/docs/_examples/animations/ts/app/hero-list-enter-leave.component.ts b/public/docs/_examples/animations/ts/app/hero-list-enter-leave.component.ts
index a37efb6464..05944c84f1 100644
--- a/public/docs/_examples/animations/ts/app/hero-list-enter-leave.component.ts
+++ b/public/docs/_examples/animations/ts/app/hero-list-enter-leave.component.ts
@@ -23,7 +23,7 @@ import { Heroes } from './hero.service';
     </ul>
   `,
   // #enddocregion template
-  styleUrls: ['hero-list.component.css'],
+  styleUrls: ['./hero-list.component.css'],
   /* The element here always has the state "in" when it
    * is present. We animate two transitions: From void
    * to in and from in to void, to achieve an animated
diff --git a/public/docs/_examples/animations/ts/app/hero-list-groups.component.ts b/public/docs/_examples/animations/ts/app/hero-list-groups.component.ts
index 70fb11d426..dda696eca2 100644
--- a/public/docs/_examples/animations/ts/app/hero-list-groups.component.ts
+++ b/public/docs/_examples/animations/ts/app/hero-list-groups.component.ts
@@ -22,7 +22,7 @@ import { Heroes } from './hero.service';
       </li>
     </ul>
   `,
-  styleUrls: ['hero-list.component.css'],
+  styleUrls: ['./hero-list.component.css'],
   styles: [`
     li {
       padding: 0 !important;
diff --git a/public/docs/_examples/animations/ts/app/hero-list-inline-styles.component.ts b/public/docs/_examples/animations/ts/app/hero-list-inline-styles.component.ts
index e22bd3121f..19e6fb8cce 100644
--- a/public/docs/_examples/animations/ts/app/hero-list-inline-styles.component.ts
+++ b/public/docs/_examples/animations/ts/app/hero-list-inline-styles.component.ts
@@ -26,7 +26,7 @@ import { Heroes } from './hero.service';
    </ul>
  `,
  // #enddocregion template
- styleUrls: ['hero-list.component.css'],
+ styleUrls: ['./hero-list.component.css'],
  /**
   * Define two states, "inactive" and "active", and the end
   * styles that apply whenever the element is in those states.
diff --git a/public/docs/_examples/animations/ts/app/hero-list-multistep.component.ts b/public/docs/_examples/animations/ts/app/hero-list-multistep.component.ts
index adea35047c..25c10cc533 100644
--- a/public/docs/_examples/animations/ts/app/hero-list-multistep.component.ts
+++ b/public/docs/_examples/animations/ts/app/hero-list-multistep.component.ts
@@ -27,7 +27,7 @@ import { Heroes } from './hero.service';
     </ul>
   `,
   // #enddocregion template
-  styleUrls: ['hero-list.component.css'],
+  styleUrls: ['./hero-list.component.css'],
   /* The element here always has the state "in" when it
    * is present. We animate two transitions: From void
    * to in and from in to void, to achieve an animated
diff --git a/public/docs/_examples/animations/ts/app/hero-list-timings.component.ts b/public/docs/_examples/animations/ts/app/hero-list-timings.component.ts
index 07fdcfb828..eed6f90004 100644
--- a/public/docs/_examples/animations/ts/app/hero-list-timings.component.ts
+++ b/public/docs/_examples/animations/ts/app/hero-list-timings.component.ts
@@ -22,7 +22,7 @@ import { Heroes } from './hero.service';
       </li>
     </ul>
   `,
-  styleUrls: ['hero-list.component.css'],
+  styleUrls: ['./hero-list.component.css'],
   /* The element here always has the state "in" when it
    * is present. We animate two transitions: From void
    * to in and from in to void, to achieve an animated
diff --git a/public/docs/_examples/animations/ts/app/hero-list-twoway.component.ts b/public/docs/_examples/animations/ts/app/hero-list-twoway.component.ts
index d5c9b2a3dd..c9ec43f904 100644
--- a/public/docs/_examples/animations/ts/app/hero-list-twoway.component.ts
+++ b/public/docs/_examples/animations/ts/app/hero-list-twoway.component.ts
@@ -27,7 +27,7 @@ import { Heroes } from './hero.service';
    </ul>
  `,
  // #enddocregion template
- styleUrls: ['hero-list.component.css'],
+ styleUrls: ['./hero-list.component.css'],
  /*
   * Define two states, "inactive" and "active", and the end
   * styles that apply whenever the element is in those states.
diff --git a/public/docs/_examples/architecture/ts/app/hero-detail.component.ts b/public/docs/_examples/architecture/ts/app/hero-detail.component.ts
index bdebf09f9e..44a702ad49 100644
--- a/public/docs/_examples/architecture/ts/app/hero-detail.component.ts
+++ b/public/docs/_examples/architecture/ts/app/hero-detail.component.ts
@@ -5,7 +5,7 @@ import { Hero } from './hero';
 @Component({
   moduleId: module.id,
   selector: 'hero-detail',
-  templateUrl: 'hero-detail.component.html'
+  templateUrl: './hero-detail.component.html'
 })
 export class HeroDetailComponent {
   @Input() hero: Hero;
diff --git a/public/docs/_examples/architecture/ts/app/hero-list.component.ts b/public/docs/_examples/architecture/ts/app/hero-list.component.ts
index 42f18aed2f..f72f57eef4 100644
--- a/public/docs/_examples/architecture/ts/app/hero-list.component.ts
+++ b/public/docs/_examples/architecture/ts/app/hero-list.component.ts
@@ -7,7 +7,7 @@ import { HeroService }         from './hero.service';
 @Component({
   moduleId: module.id,
   selector:    'hero-list',
-  templateUrl: 'hero-list.component.html',
+  templateUrl: './hero-list.component.html',
   providers:  [ HeroService ]
 })
 // #enddocregion providers
diff --git a/public/docs/_examples/attribute-directives/ts/app/app.component.1.ts b/public/docs/_examples/attribute-directives/ts/app/app.component.1.ts
index 13bb5ef1f4..d65cb57850 100644
--- a/public/docs/_examples/attribute-directives/ts/app/app.component.1.ts
+++ b/public/docs/_examples/attribute-directives/ts/app/app.component.1.ts
@@ -3,7 +3,7 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.1.html'
+  templateUrl: './app.component.1.html'
 })
 // #docregion class
 export class AppComponent {
diff --git a/public/docs/_examples/attribute-directives/ts/app/app.component.ts b/public/docs/_examples/attribute-directives/ts/app/app.component.ts
index 800a5864d6..a88e8e49a3 100644
--- a/public/docs/_examples/attribute-directives/ts/app/app.component.ts
+++ b/public/docs/_examples/attribute-directives/ts/app/app.component.ts
@@ -4,7 +4,7 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 // #docregion class
 export class AppComponent {
diff --git a/public/docs/_examples/cb-a1-a2-quick-reference/ts/app/app.component.ts b/public/docs/_examples/cb-a1-a2-quick-reference/ts/app/app.component.ts
index c6959c2da6..689e7a22aa 100644
--- a/public/docs/_examples/cb-a1-a2-quick-reference/ts/app/app.component.ts
+++ b/public/docs/_examples/cb-a1-a2-quick-reference/ts/app/app.component.ts
@@ -6,8 +6,8 @@ import { IMovie } from './movie';
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.html',
-  styleUrls: [ 'app.component.css' ],
+  templateUrl: './app.component.html',
+  styleUrls: [ './app.component.css' ],
   providers: [ MovieService ]
 })
 export class AppComponent {
diff --git a/public/docs/_examples/cb-a1-a2-quick-reference/ts/app/movie-list.component.ts b/public/docs/_examples/cb-a1-a2-quick-reference/ts/app/movie-list.component.ts
index 951cccb6df..2481710bb1 100644
--- a/public/docs/_examples/cb-a1-a2-quick-reference/ts/app/movie-list.component.ts
+++ b/public/docs/_examples/cb-a1-a2-quick-reference/ts/app/movie-list.component.ts
@@ -10,10 +10,10 @@ import { MovieService } from './movie.service';
 @Component({
   moduleId: module.id,
   selector: 'movie-list',
-  templateUrl: 'movie-list.component.html',
+  templateUrl: './movie-list.component.html',
 // #enddocregion component
 // #docregion style-url
-  styleUrls: [ 'movie-list.component.css' ],
+  styleUrls: [ './movie-list.component.css' ],
 // #enddocregion style-url
 })
 // #enddocregion component
diff --git a/public/docs/_examples/cb-aot-compiler/ts/app/app.component.ts b/public/docs/_examples/cb-aot-compiler/ts/app/app.component.ts
index cd2d700db8..680c07d682 100644
--- a/public/docs/_examples/cb-aot-compiler/ts/app/app.component.ts
+++ b/public/docs/_examples/cb-aot-compiler/ts/app/app.component.ts
@@ -4,7 +4,7 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 export class AppComponent {
   showHeading = true;
diff --git a/public/docs/_examples/cb-component-communication/ts/app/app.component.ts b/public/docs/_examples/cb-component-communication/ts/app/app.component.ts
index be8d89aff7..ab2d3d9c33 100644
--- a/public/docs/_examples/cb-component-communication/ts/app/app.component.ts
+++ b/public/docs/_examples/cb-component-communication/ts/app/app.component.ts
@@ -3,6 +3,6 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 export class AppComponent { }
diff --git a/public/docs/_examples/cb-component-relative-paths/ts/app/some.component.ts b/public/docs/_examples/cb-component-relative-paths/ts/app/some.component.ts
index 2bd56c6930..327727873c 100644
--- a/public/docs/_examples/cb-component-relative-paths/ts/app/some.component.ts
+++ b/public/docs/_examples/cb-component-relative-paths/ts/app/some.component.ts
@@ -24,8 +24,8 @@ export class SomeAbsoluteComponent {
   moduleId: module.id,
   // #enddocregion module-id
   selector: 'relative-path',
-  templateUrl: 'some.component.html',
-  styleUrls:  ['some.component.css']
+  templateUrl: './some.component.html',
+  styleUrls:  ['./some.component.css']
 })
 // #enddocregion relative-config
 
diff --git a/public/docs/_examples/cb-dependency-injection/ts/app/app.component.ts b/public/docs/_examples/cb-dependency-injection/ts/app/app.component.ts
index 820d43d6ab..a3b938f7e5 100644
--- a/public/docs/_examples/cb-dependency-injection/ts/app/app.component.ts
+++ b/public/docs/_examples/cb-dependency-injection/ts/app/app.component.ts
@@ -9,7 +9,7 @@ import { UserService }        from './user.service';
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.html',
+  templateUrl: './app.component.html',
 // #docregion providers
   providers: [ LoggerService, UserContextService, UserService ]
 // #enddocregion providers
diff --git a/public/docs/_examples/cb-dynamic-form/ts/app/dynamic-form-question.component.ts b/public/docs/_examples/cb-dynamic-form/ts/app/dynamic-form-question.component.ts
index 69194fc0e7..24d0bd168b 100644
--- a/public/docs/_examples/cb-dynamic-form/ts/app/dynamic-form-question.component.ts
+++ b/public/docs/_examples/cb-dynamic-form/ts/app/dynamic-form-question.component.ts
@@ -7,7 +7,7 @@ import { QuestionBase }     from './question-base';
 @Component({
   moduleId: module.id,
   selector: 'df-question',
-  templateUrl: 'dynamic-form-question.component.html'
+  templateUrl: './dynamic-form-question.component.html'
 })
 export class DynamicFormQuestionComponent {
   @Input() question: QuestionBase<any>;
diff --git a/public/docs/_examples/cb-dynamic-form/ts/app/dynamic-form.component.ts b/public/docs/_examples/cb-dynamic-form/ts/app/dynamic-form.component.ts
index e0331797bf..32aaf73114 100644
--- a/public/docs/_examples/cb-dynamic-form/ts/app/dynamic-form.component.ts
+++ b/public/docs/_examples/cb-dynamic-form/ts/app/dynamic-form.component.ts
@@ -8,7 +8,7 @@ import { QuestionControlService }    from './question-control.service';
 @Component({
   moduleId: module.id,
   selector: 'dynamic-form',
-  templateUrl: 'dynamic-form.component.html',
+  templateUrl: './dynamic-form.component.html',
   providers: [ QuestionControlService ]
 })
 export class DynamicFormComponent implements OnInit {
diff --git a/public/docs/_examples/cb-form-validation/ts/app/reactive/hero-form-reactive.component.ts b/public/docs/_examples/cb-form-validation/ts/app/reactive/hero-form-reactive.component.ts
index 7e7dfa0739..d4924e7ef9 100644
--- a/public/docs/_examples/cb-form-validation/ts/app/reactive/hero-form-reactive.component.ts
+++ b/public/docs/_examples/cb-form-validation/ts/app/reactive/hero-form-reactive.component.ts
@@ -10,7 +10,7 @@ import { forbiddenNameValidator } from '../shared/forbidden-name.directive';
 @Component({
   moduleId:  module.id,
   selector: 'hero-form-reactive3',
-  templateUrl: 'hero-form-reactive.component.html'
+  templateUrl: './hero-form-reactive.component.html'
 })
 export class HeroFormReactiveComponent implements OnInit {
 
diff --git a/public/docs/_examples/cb-form-validation/ts/app/template/hero-form-template1.component.ts b/public/docs/_examples/cb-form-validation/ts/app/template/hero-form-template1.component.ts
index 845fcc9abc..b096ca8cf4 100644
--- a/public/docs/_examples/cb-form-validation/ts/app/template/hero-form-template1.component.ts
+++ b/public/docs/_examples/cb-form-validation/ts/app/template/hero-form-template1.component.ts
@@ -9,7 +9,7 @@ import { Hero }      from '../shared/hero';
 @Component({
   moduleId:  module.id,
   selector: 'hero-form-template1',
-  templateUrl: 'hero-form-template1.component.html'
+  templateUrl: './hero-form-template1.component.html'
 })
 // #docregion class
 export class HeroFormTemplate1Component {
diff --git a/public/docs/_examples/cb-form-validation/ts/app/template/hero-form-template2.component.ts b/public/docs/_examples/cb-form-validation/ts/app/template/hero-form-template2.component.ts
index e2781ec617..8b3e150347 100644
--- a/public/docs/_examples/cb-form-validation/ts/app/template/hero-form-template2.component.ts
+++ b/public/docs/_examples/cb-form-validation/ts/app/template/hero-form-template2.component.ts
@@ -9,7 +9,7 @@ import { Hero }      from '../shared/hero';
 @Component({
   moduleId:  module.id,
   selector: 'hero-form-template2',
-  templateUrl: 'hero-form-template2.component.html'
+  templateUrl: './hero-form-template2.component.html'
 })
 export class HeroFormTemplate2Component implements AfterViewChecked {
 
diff --git a/public/docs/_examples/cb-i18n/ts/app/app.component.ts b/public/docs/_examples/cb-i18n/ts/app/app.component.ts
index e8f93321a4..09adc99d2a 100644
--- a/public/docs/_examples/cb-i18n/ts/app/app.component.ts
+++ b/public/docs/_examples/cb-i18n/ts/app/app.component.ts
@@ -4,7 +4,7 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 export class AppComponent {
   wolves = 0;
diff --git a/public/docs/_examples/cb-ts-to-js/js-es6-decorators/app/app.component.es6 b/public/docs/_examples/cb-ts-to-js/js-es6-decorators/app/app.component.es6
index e5f158dbed..6a16666aa8 100644
--- a/public/docs/_examples/cb-ts-to-js/js-es6-decorators/app/app.component.es6
+++ b/public/docs/_examples/cb-ts-to-js/js-es6-decorators/app/app.component.es6
@@ -3,7 +3,7 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.html',
+  templateUrl: './app.component.html',
   styles: [
     // See hero-di-inject-additional.component
     'hero-host, hero-host-meta { border: 1px dashed black; display: block; padding: 4px;}',
diff --git a/public/docs/_examples/cb-ts-to-js/js-es6-decorators/app/confirm.component.es6 b/public/docs/_examples/cb-ts-to-js/js-es6-decorators/app/confirm.component.es6
index 08a0ed6c60..ee9ee6f884 100644
--- a/public/docs/_examples/cb-ts-to-js/js-es6-decorators/app/confirm.component.es6
+++ b/public/docs/_examples/cb-ts-to-js/js-es6-decorators/app/confirm.component.es6
@@ -4,7 +4,7 @@ import { Component, EventEmitter, Input, Output } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'app-confirm',
-  templateUrl: 'confirm.component.html'
+  templateUrl: './confirm.component.html'
 })
 export class ConfirmComponent {
   @Input() okMsg = '';
diff --git a/public/docs/_examples/cb-ts-to-js/js-es6-decorators/app/hero-title.component.es6 b/public/docs/_examples/cb-ts-to-js/js-es6-decorators/app/hero-title.component.es6
index 25460d34f7..32988dcdda 100644
--- a/public/docs/_examples/cb-ts-to-js/js-es6-decorators/app/hero-title.component.es6
+++ b/public/docs/_examples/cb-ts-to-js/js-es6-decorators/app/hero-title.component.es6
@@ -5,7 +5,7 @@ import { Attribute, Component, Inject, Optional } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'hero-title',
-  templateUrl: 'hero-title.component.html'
+  templateUrl: './hero-title.component.html'
 })
 // #enddocregion templateUrl
 export class HeroTitleComponent {
diff --git a/public/docs/_examples/cb-ts-to-js/js-es6/app/app.component.es6 b/public/docs/_examples/cb-ts-to-js/js-es6/app/app.component.es6
index 9615b98a1f..e8fd92620b 100644
--- a/public/docs/_examples/cb-ts-to-js/js-es6/app/app.component.es6
+++ b/public/docs/_examples/cb-ts-to-js/js-es6/app/app.component.es6
@@ -10,7 +10,7 @@ AppComponent.annotations = [
   new Component({
     moduleId: module.id,
     selector: 'my-app',
-    templateUrl: 'app.component.html',
+    templateUrl: './app.component.html',
     styles: [
       // See hero-di-inject-additional.component
       'hero-host { border: 1px dashed black; display: block; padding: 4px;}',
diff --git a/public/docs/_examples/cb-ts-to-js/js-es6/app/confirm.component.es6 b/public/docs/_examples/cb-ts-to-js/js-es6/app/confirm.component.es6
index d42a553688..20c3288766 100644
--- a/public/docs/_examples/cb-ts-to-js/js-es6/app/confirm.component.es6
+++ b/public/docs/_examples/cb-ts-to-js/js-es6/app/confirm.component.es6
@@ -18,7 +18,7 @@ ConfirmComponent.annotations = [
   new Component({
     moduleId: module.id,
     selector: 'app-confirm',
-    templateUrl: 'confirm.component.html',
+    templateUrl: './confirm.component.html',
     inputs: [
       'okMsg',
       'notOkMsg: cancelMsg'
diff --git a/public/docs/_examples/cb-ts-to-js/js-es6/app/hero-title.component.es6 b/public/docs/_examples/cb-ts-to-js/js-es6/app/hero-title.component.es6
index ff1e6ce026..1656226602 100644
--- a/public/docs/_examples/cb-ts-to-js/js-es6/app/hero-title.component.es6
+++ b/public/docs/_examples/cb-ts-to-js/js-es6/app/hero-title.component.es6
@@ -18,7 +18,7 @@ HeroTitleComponent.annotations = [
   new Component({
     moduleId: module.id,
     selector: 'hero-title',
-    templateUrl: 'hero-title.component.html'
+    templateUrl: './hero-title.component.html'
   })
 ];
 // #enddocregion templateUrl
diff --git a/public/docs/_examples/cb-ts-to-js/ts/app/app.component.ts b/public/docs/_examples/cb-ts-to-js/ts/app/app.component.ts
index 722d812f63..8c33f6e994 100644
--- a/public/docs/_examples/cb-ts-to-js/ts/app/app.component.ts
+++ b/public/docs/_examples/cb-ts-to-js/ts/app/app.component.ts
@@ -3,7 +3,7 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.html',
+  templateUrl: './app.component.html',
   styles: [
     // See hero-di-inject-additional.component
     'hero-host, hero-host-meta { border: 1px dashed black; display: block; padding: 4px;}',
diff --git a/public/docs/_examples/cb-ts-to-js/ts/app/confirm.component.ts b/public/docs/_examples/cb-ts-to-js/ts/app/confirm.component.ts
index 08a0ed6c60..ee9ee6f884 100644
--- a/public/docs/_examples/cb-ts-to-js/ts/app/confirm.component.ts
+++ b/public/docs/_examples/cb-ts-to-js/ts/app/confirm.component.ts
@@ -4,7 +4,7 @@ import { Component, EventEmitter, Input, Output } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'app-confirm',
-  templateUrl: 'confirm.component.html'
+  templateUrl: './confirm.component.html'
 })
 export class ConfirmComponent {
   @Input() okMsg = '';
diff --git a/public/docs/_examples/cb-ts-to-js/ts/app/hero-title.component.ts b/public/docs/_examples/cb-ts-to-js/ts/app/hero-title.component.ts
index 074f2edd61..e8e68684e2 100644
--- a/public/docs/_examples/cb-ts-to-js/ts/app/hero-title.component.ts
+++ b/public/docs/_examples/cb-ts-to-js/ts/app/hero-title.component.ts
@@ -5,7 +5,7 @@ import { Attribute, Component, Inject, Optional } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'hero-title',
-  templateUrl: 'hero-title.component.html'
+  templateUrl: './hero-title.component.html'
 })
 // #enddocregion templateUrl
 export class HeroTitleComponent {
diff --git a/public/docs/_examples/cli-quickstart/ts/src/app/cli-quickstart.component.ts b/public/docs/_examples/cli-quickstart/ts/src/app/cli-quickstart.component.ts
index 8c6b3a43cc..2d58ec04ff 100644
--- a/public/docs/_examples/cli-quickstart/ts/src/app/cli-quickstart.component.ts
+++ b/public/docs/_examples/cli-quickstart/ts/src/app/cli-quickstart.component.ts
@@ -6,8 +6,8 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'cli-quickstart-app',
-  templateUrl: 'cli-quickstart.component.html',
-  styleUrls: ['cli-quickstart.component.css']
+  templateUrl: './cli-quickstart.component.html',
+  styleUrls: ['./cli-quickstart.component.css']
 })
 // #enddocregion metadata
 // #docregion title, class
diff --git a/public/docs/_examples/component-styles/ts/app/quest-summary.component.ts b/public/docs/_examples/component-styles/ts/app/quest-summary.component.ts
index 9952702ddf..c43239e368 100644
--- a/public/docs/_examples/component-styles/ts/app/quest-summary.component.ts
+++ b/public/docs/_examples/component-styles/ts/app/quest-summary.component.ts
@@ -7,8 +7,8 @@ import { Component, ViewEncapsulation } from '@angular/core';
   moduleId: module.id,
   selector: 'quest-summary',
   // #docregion urls
-  templateUrl: 'quest-summary.component.html',
-  styleUrls:  ['quest-summary.component.css']
+  templateUrl: './quest-summary.component.html',
+  styleUrls:  ['./quest-summary.component.css']
   // #enddocregion urls
 })
 export class QuestSummaryComponent { }
diff --git a/public/docs/_examples/forms/ts/app/hero-form.component.ts b/public/docs/_examples/forms/ts/app/hero-form.component.ts
index a4da9bbf92..9c86266ce3 100644
--- a/public/docs/_examples/forms/ts/app/hero-form.component.ts
+++ b/public/docs/_examples/forms/ts/app/hero-form.component.ts
@@ -8,7 +8,7 @@ import { Hero }    from './hero';
 @Component({
   moduleId: module.id,
   selector: 'hero-form',
-  templateUrl: 'hero-form.component.html'
+  templateUrl: './hero-form.component.html'
 })
 export class HeroFormComponent {
 
diff --git a/public/docs/_examples/homepage-hello-world/ts/app/hello_world.ts b/public/docs/_examples/homepage-hello-world/ts/app/hello_world.ts
index 3db096cd75..7bdf994436 100644
--- a/public/docs/_examples/homepage-hello-world/ts/app/hello_world.ts
+++ b/public/docs/_examples/homepage-hello-world/ts/app/hello_world.ts
@@ -9,7 +9,7 @@ import { Component } from '@angular/core';
   selector: 'hello-world',
 
   // Location of the template for this component
-  templateUrl: 'hello_world.html'
+  templateUrl: './hello_world.html'
 })
 export class HelloWorldComponent {
 
diff --git a/public/docs/_examples/lifecycle-hooks/ts/app/app.component.ts b/public/docs/_examples/lifecycle-hooks/ts/app/app.component.ts
index 42e09d0fe4..a917088410 100644
--- a/public/docs/_examples/lifecycle-hooks/ts/app/app.component.ts
+++ b/public/docs/_examples/lifecycle-hooks/ts/app/app.component.ts
@@ -3,6 +3,6 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 export class AppComponent { }
diff --git a/public/docs/_examples/lifecycle-hooks/ts/app/do-check.component.ts b/public/docs/_examples/lifecycle-hooks/ts/app/do-check.component.ts
index aadd6eb26f..bdd96ed65b 100644
--- a/public/docs/_examples/lifecycle-hooks/ts/app/do-check.component.ts
+++ b/public/docs/_examples/lifecycle-hooks/ts/app/do-check.component.ts
@@ -77,7 +77,7 @@ export class DoCheckComponent implements DoCheck {
 @Component({
   moduleId: module.id,
   selector: 'do-check-parent',
-  templateUrl: 'do-check-parent.component.html',
+  templateUrl: './do-check-parent.component.html',
   styles: ['.parent {background: Lavender}']
 })
 export class DoCheckParentComponent {
diff --git a/public/docs/_examples/lifecycle-hooks/ts/app/on-changes.component.ts b/public/docs/_examples/lifecycle-hooks/ts/app/on-changes.component.ts
index da3aa70716..c9a243a5f0 100644
--- a/public/docs/_examples/lifecycle-hooks/ts/app/on-changes.component.ts
+++ b/public/docs/_examples/lifecycle-hooks/ts/app/on-changes.component.ts
@@ -51,7 +51,7 @@ export class OnChangesComponent implements OnChanges {
 @Component({
   moduleId: module.id,
   selector: 'on-changes-parent',
-  templateUrl: 'on-changes-parent.component.html',
+  templateUrl: './on-changes-parent.component.html',
   styles: ['.parent {background: Lavender;}']
 })
 export class OnChangesParentComponent {
diff --git a/public/docs/_examples/lifecycle-hooks/ts/app/spy.component.ts b/public/docs/_examples/lifecycle-hooks/ts/app/spy.component.ts
index 99fefac6ec..6cbed98d1d 100644
--- a/public/docs/_examples/lifecycle-hooks/ts/app/spy.component.ts
+++ b/public/docs/_examples/lifecycle-hooks/ts/app/spy.component.ts
@@ -6,7 +6,7 @@ import { LoggerService }  from './logger.service';
 @Component({
   moduleId: module.id,
   selector: 'spy-parent',
-  templateUrl: 'spy.component.html',
+  templateUrl: './spy.component.html',
   styles: [
      '.parent {background: khaki;}',
      '.heroes {background: LightYellow; padding: 0 8px}'
diff --git a/public/docs/_examples/ngmodule/ts/app/contact/contact.component.3.ts b/public/docs/_examples/ngmodule/ts/app/contact/contact.component.3.ts
index 30576f8f38..fcc409b9af 100644
--- a/public/docs/_examples/ngmodule/ts/app/contact/contact.component.3.ts
+++ b/public/docs/_examples/ngmodule/ts/app/contact/contact.component.3.ts
@@ -7,8 +7,8 @@ import { UserService }    from '../user.service';
 @Component({
   moduleId: module.id,
   selector: 'app-contact',
-  templateUrl: 'contact.component.html',
-  styleUrls: [ 'contact.component.css' ]
+  templateUrl: './contact.component.html',
+  styleUrls: [ './contact.component.css' ]
 })
 export class ContactComponent implements OnInit {
   contact:  Contact;
diff --git a/public/docs/_examples/ngmodule/ts/app/contact/contact.component.ts b/public/docs/_examples/ngmodule/ts/app/contact/contact.component.ts
index ee7c387c10..f9116a4213 100644
--- a/public/docs/_examples/ngmodule/ts/app/contact/contact.component.ts
+++ b/public/docs/_examples/ngmodule/ts/app/contact/contact.component.ts
@@ -8,8 +8,8 @@ import { UserService }             from '../core/user.service';
 @Component({
   moduleId: module.id,
   selector: 'app-contact',
-  templateUrl: 'contact.component.html',
-  styleUrls: [ 'contact.component.css' ]
+  templateUrl: './contact.component.html',
+  styleUrls: [ './contact.component.css' ]
 })
 export class ContactComponent implements OnInit {
   contact:  Contact;
diff --git a/public/docs/_examples/ngmodule/ts/app/core/title.component.ts b/public/docs/_examples/ngmodule/ts/app/core/title.component.ts
index be2df3acf1..5fbd64d5fd 100644
--- a/public/docs/_examples/ngmodule/ts/app/core/title.component.ts
+++ b/public/docs/_examples/ngmodule/ts/app/core/title.component.ts
@@ -5,7 +5,7 @@ import { UserService }      from '../core/user.service';
 @Component({
   moduleId: module.id,
   selector: 'app-title',
-  templateUrl: 'title.component.html',
+  templateUrl: './title.component.html',
 })
 export class TitleComponent {
   @Input() subtitle = '';
diff --git a/public/docs/_examples/ngmodule/ts/app/title.component.ts b/public/docs/_examples/ngmodule/ts/app/title.component.ts
index cd5a19aad0..c5815edcbd 100644
--- a/public/docs/_examples/ngmodule/ts/app/title.component.ts
+++ b/public/docs/_examples/ngmodule/ts/app/title.component.ts
@@ -9,7 +9,7 @@ import { UserService } from './user.service';
 @Component({
   moduleId: module.id,
   selector: 'app-title',
-  templateUrl: 'title.component.html',
+  templateUrl: './title.component.html',
 })
 export class TitleComponent {
   @Input() subtitle = '';
diff --git a/public/docs/_examples/pipes/ts/app/app.component.ts b/public/docs/_examples/pipes/ts/app/app.component.ts
index ca83f1b6af..d21801ddcf 100644
--- a/public/docs/_examples/pipes/ts/app/app.component.ts
+++ b/public/docs/_examples/pipes/ts/app/app.component.ts
@@ -4,7 +4,7 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 export class AppComponent {
   birthday = new Date(1988, 3, 15); // April 15, 1988
diff --git a/public/docs/_examples/pipes/ts/app/flying-heroes.component.ts b/public/docs/_examples/pipes/ts/app/flying-heroes.component.ts
index 26a43997aa..5e7e4bd3f9 100644
--- a/public/docs/_examples/pipes/ts/app/flying-heroes.component.ts
+++ b/public/docs/_examples/pipes/ts/app/flying-heroes.component.ts
@@ -7,7 +7,7 @@ import { HEROES }                 from './heroes';
 @Component({
   moduleId: module.id,
   selector: 'flying-heroes',
-  templateUrl: 'flying-heroes.component.html',
+  templateUrl: './flying-heroes.component.html',
   styles: ['#flyers, #all {font-style: italic}']
 })
 // #docregion v1
@@ -52,7 +52,7 @@ export class FlyingHeroesComponent {
 @Component({
   moduleId: module.id,
   selector: 'flying-heroes-impure',
-  templateUrl: 'flying-heroes-impure.component.html',
+  templateUrl: './flying-heroes-impure.component.html',
 // #enddocregion impure-component
   styles: ['.flyers, .all {font-style: italic}'],
 // #docregion impure-component
diff --git a/public/docs/_examples/router/ts/app/compose-message.component.ts b/public/docs/_examples/router/ts/app/compose-message.component.ts
index d6b15ad38c..38fd47fded 100644
--- a/public/docs/_examples/router/ts/app/compose-message.component.ts
+++ b/public/docs/_examples/router/ts/app/compose-message.component.ts
@@ -6,7 +6,7 @@ import { slideInDownAnimation }   from './animations';
 
 @Component({
   moduleId: module.id,
-  templateUrl: 'compose-message.component.html',
+  templateUrl: './compose-message.component.html',
   styles: [ ':host { position: relative; bottom: 10%; }' ],
   animations: [ slideInDownAnimation ]
 })
diff --git a/public/docs/_examples/security/ts/app/bypass-security.component.ts b/public/docs/_examples/security/ts/app/bypass-security.component.ts
index 2aecfddab9..769c0ba95a 100644
--- a/public/docs/_examples/security/ts/app/bypass-security.component.ts
+++ b/public/docs/_examples/security/ts/app/bypass-security.component.ts
@@ -6,7 +6,7 @@ import { DomSanitizer, SafeResourceUrl, SafeUrl } from '@angular/platform-browse
 @Component({
   selector: 'bypass-security',
   moduleId: module.id,
-  templateUrl: 'bypass-security.component.html',
+  templateUrl: './bypass-security.component.html',
 })
 export class BypassSecurityComponent {
   dangerousUrl: string;
diff --git a/public/docs/_examples/security/ts/app/inner-html-binding.component.ts b/public/docs/_examples/security/ts/app/inner-html-binding.component.ts
index 603a1981d6..23c921e979 100644
--- a/public/docs/_examples/security/ts/app/inner-html-binding.component.ts
+++ b/public/docs/_examples/security/ts/app/inner-html-binding.component.ts
@@ -4,7 +4,7 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'inner-html-binding',
-  templateUrl: 'inner-html-binding.component.html',
+  templateUrl: './inner-html-binding.component.html',
 })
 // #docregion class
 export class InnerHtmlBindingComponent {
diff --git a/public/docs/_examples/server-communication/ts/app/toh/hero-list.component.promise.ts b/public/docs/_examples/server-communication/ts/app/toh/hero-list.component.promise.ts
index cde90d34bf..abe6a554e9 100644
--- a/public/docs/_examples/server-communication/ts/app/toh/hero-list.component.promise.ts
+++ b/public/docs/_examples/server-communication/ts/app/toh/hero-list.component.promise.ts
@@ -7,7 +7,7 @@ import { HeroService }       from './hero.service.promise';
 @Component({
   selector: 'hero-list-promise',
   moduleId: module.id,
-  templateUrl: 'hero-list.component.html',
+  templateUrl: './hero-list.component.html',
   providers: [ HeroService ],
   styles: ['.error {color:red;}']
 })
diff --git a/public/docs/_examples/server-communication/ts/app/toh/hero-list.component.ts b/public/docs/_examples/server-communication/ts/app/toh/hero-list.component.ts
index f52144dcff..e28faacc0e 100644
--- a/public/docs/_examples/server-communication/ts/app/toh/hero-list.component.ts
+++ b/public/docs/_examples/server-communication/ts/app/toh/hero-list.component.ts
@@ -7,7 +7,7 @@ import { HeroService }       from './hero.service';
 @Component({
   moduleId: module.id,
   selector: 'hero-list',
-  templateUrl: 'hero-list.component.html',
+  templateUrl: './hero-list.component.html',
   providers: [ HeroService ],
   styles: ['.error {color:red;}']
 })
diff --git a/public/docs/_examples/server-communication/ts/app/wiki/wiki-smart.component.ts b/public/docs/_examples/server-communication/ts/app/wiki/wiki-smart.component.ts
index e23138a560..31d7ae731e 100644
--- a/public/docs/_examples/server-communication/ts/app/wiki/wiki-smart.component.ts
+++ b/public/docs/_examples/server-communication/ts/app/wiki/wiki-smart.component.ts
@@ -12,7 +12,7 @@ import { WikipediaService } from './wikipedia.service';
 @Component({
   moduleId: module.id,
   selector: 'my-wiki-smart',
-  templateUrl: 'wiki.component.html',
+  templateUrl: './wiki.component.html',
   providers: [ WikipediaService ]
 })
 export class WikiSmartComponent implements OnInit {
diff --git a/public/docs/_examples/structural-directives/ts/app/structural-directives.component.ts b/public/docs/_examples/structural-directives/ts/app/structural-directives.component.ts
index d831e4960d..1c073c74e1 100644
--- a/public/docs/_examples/structural-directives/ts/app/structural-directives.component.ts
+++ b/public/docs/_examples/structural-directives/ts/app/structural-directives.component.ts
@@ -5,7 +5,7 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'structural-directives',
-  templateUrl: 'structural-directives.component.html',
+  templateUrl: './structural-directives.component.html',
   styles: ['button { min-width: 100px; }']
 })
 export class StructuralDirectivesComponent {
diff --git a/public/docs/_examples/style-guide/ts/01-01/app/app.component.ts b/public/docs/_examples/style-guide/ts/01-01/app/app.component.ts
index a9f29647a0..7997c4433c 100644
--- a/public/docs/_examples/style-guide/ts/01-01/app/app.component.ts
+++ b/public/docs/_examples/style-guide/ts/01-01/app/app.component.ts
@@ -9,7 +9,7 @@ import { HeroService } from './heroes';
   template: `
       <toh-heroes></toh-heroes>
     `,
-  styleUrls: ['app.component.css'],
+  styleUrls: ['./app.component.css'],
   providers: [ HeroService ]
 })
 export class AppComponent { }
diff --git a/public/docs/_examples/style-guide/ts/03-06/app/app.component.ts b/public/docs/_examples/style-guide/ts/03-06/app/app.component.ts
index 0cf424afd7..b7c47f72d0 100644
--- a/public/docs/_examples/style-guide/ts/03-06/app/app.component.ts
+++ b/public/docs/_examples/style-guide/ts/03-06/app/app.component.ts
@@ -6,7 +6,7 @@ import { ExceptionService, SpinnerService, ToastService } from './core';
 @Component({
   moduleId: module.id,
   selector: 'sg-app',
-  templateUrl: 'app.component.html',
+  templateUrl: './app.component.html',
   providers: [HeroService, ExceptionService, SpinnerService, ToastService]
 })
 export class AppComponent implements OnInit {
diff --git a/public/docs/_examples/style-guide/ts/04-08/app/heroes/heroes.component.ts b/public/docs/_examples/style-guide/ts/04-08/app/heroes/heroes.component.ts
index b3a76ff120..f6653cdf53 100644
--- a/public/docs/_examples/style-guide/ts/04-08/app/heroes/heroes.component.ts
+++ b/public/docs/_examples/style-guide/ts/04-08/app/heroes/heroes.component.ts
@@ -8,7 +8,7 @@ import { Component, OnInit } from '@angular/core';
   moduleId: module.id,
   // #docregion example
   selector: 'toh-heroes',
-  templateUrl: 'heroes.component.html'
+  templateUrl: './heroes.component.html'
 })
 export class HeroesComponent implements OnInit {
   // #enddocregion example
diff --git a/public/docs/_examples/style-guide/ts/04-10/app/heroes/heroes.component.ts b/public/docs/_examples/style-guide/ts/04-10/app/heroes/heroes.component.ts
index 14eb56a7f0..e22b39843d 100644
--- a/public/docs/_examples/style-guide/ts/04-10/app/heroes/heroes.component.ts
+++ b/public/docs/_examples/style-guide/ts/04-10/app/heroes/heroes.component.ts
@@ -10,7 +10,7 @@ import { FilterTextService } from '../shared/filter-text/filter-text.service';
   moduleId: module.id,
   // #docregion example
   selector: 'toh-heroes',
-  templateUrl: 'heroes.component.html'
+  templateUrl: './heroes.component.html'
 })
 export class HeroesComponent implements OnInit {
   // #enddocregion example
diff --git a/public/docs/_examples/style-guide/ts/04-11/app/core/nav/nav.component.ts b/public/docs/_examples/style-guide/ts/04-11/app/core/nav/nav.component.ts
index ba8796251b..571040cce5 100644
--- a/public/docs/_examples/style-guide/ts/04-11/app/core/nav/nav.component.ts
+++ b/public/docs/_examples/style-guide/ts/04-11/app/core/nav/nav.component.ts
@@ -4,8 +4,8 @@ import { Component, OnInit } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'toh-nav',
-  templateUrl: 'nav.component.html',
-  styleUrls: ['nav.component.css'],
+  templateUrl: './nav.component.html',
+  styleUrls: ['./nav.component.css'],
 })
 export class NavComponent implements OnInit {
   menuItems = [
diff --git a/public/docs/_examples/style-guide/ts/04-11/app/core/spinner/spinner.component.ts b/public/docs/_examples/style-guide/ts/04-11/app/core/spinner/spinner.component.ts
index 7260eb8d88..ccd6ece7fb 100644
--- a/public/docs/_examples/style-guide/ts/04-11/app/core/spinner/spinner.component.ts
+++ b/public/docs/_examples/style-guide/ts/04-11/app/core/spinner/spinner.component.ts
@@ -8,8 +8,8 @@ import { SpinnerState, SpinnerService } from './spinner.service';
 @Component({
   moduleId: module.id,
   selector: 'toh-spinner',
-  templateUrl: 'spinner.component.html',
-  styleUrls: ['spinner.component.css']
+  templateUrl: './spinner.component.html',
+  styleUrls: ['./spinner.component.css']
 })
 export class SpinnerComponent implements OnDestroy, OnInit {
   visible = false;
diff --git a/public/docs/_examples/style-guide/ts/04-11/app/heroes/heroes.component.ts b/public/docs/_examples/style-guide/ts/04-11/app/heroes/heroes.component.ts
index b15d2dc8bc..8d86b30d89 100644
--- a/public/docs/_examples/style-guide/ts/04-11/app/heroes/heroes.component.ts
+++ b/public/docs/_examples/style-guide/ts/04-11/app/heroes/heroes.component.ts
@@ -11,7 +11,7 @@ import { SpinnerService } from '../core/spinner/spinner.service';
   moduleId: module.id,
   // #docregion example
   selector: 'toh-heroes',
-  templateUrl: 'heroes.component.html'
+  templateUrl: './heroes.component.html'
 })
 export class HeroesComponent {
   // #enddocregion example
diff --git a/public/docs/_examples/style-guide/ts/04-12/app/core/nav/nav.component.ts b/public/docs/_examples/style-guide/ts/04-12/app/core/nav/nav.component.ts
index ba8796251b..571040cce5 100644
--- a/public/docs/_examples/style-guide/ts/04-12/app/core/nav/nav.component.ts
+++ b/public/docs/_examples/style-guide/ts/04-12/app/core/nav/nav.component.ts
@@ -4,8 +4,8 @@ import { Component, OnInit } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'toh-nav',
-  templateUrl: 'nav.component.html',
-  styleUrls: ['nav.component.css'],
+  templateUrl: './nav.component.html',
+  styleUrls: ['./nav.component.css'],
 })
 export class NavComponent implements OnInit {
   menuItems = [
diff --git a/public/docs/_examples/style-guide/ts/04-12/app/heroes/heroes.component.ts b/public/docs/_examples/style-guide/ts/04-12/app/heroes/heroes.component.ts
index ee60b88178..44b3efb5c6 100644
--- a/public/docs/_examples/style-guide/ts/04-12/app/heroes/heroes.component.ts
+++ b/public/docs/_examples/style-guide/ts/04-12/app/heroes/heroes.component.ts
@@ -10,7 +10,7 @@ import { LoggerService } from '../core/logger.service';
   moduleId: module.id,
   // #docregion example
   selector: 'toh-heroes',
-  templateUrl: 'heroes.component.html'
+  templateUrl: './heroes.component.html'
 })
 export class HeroesComponent {
   // #enddocregion example
diff --git a/public/docs/_examples/style-guide/ts/05-02/app/app.component.ts b/public/docs/_examples/style-guide/ts/05-02/app/app.component.ts
index 03062c57fd..d57163f06f 100644
--- a/public/docs/_examples/style-guide/ts/05-02/app/app.component.ts
+++ b/public/docs/_examples/style-guide/ts/05-02/app/app.component.ts
@@ -3,6 +3,6 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'sg-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 export class AppComponent { }
diff --git a/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.avoid.ts b/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.avoid.ts
index 7be30dc913..9e8d05905f 100644
--- a/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.avoid.ts
+++ b/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.avoid.ts
@@ -9,7 +9,7 @@ import { Component } from '@angular/core';
   moduleId: module.id,
   // #docregion example
   selector: 'tohHeroButton',
-  templateUrl: 'hero-button.component.html'
+  templateUrl: './hero-button.component.html'
 })
 export class HeroButtonComponent {}
 // #enddocregion example
diff --git a/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.ts b/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.ts
index 439ce328d5..48de306193 100644
--- a/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.ts
+++ b/public/docs/_examples/style-guide/ts/05-02/app/heroes/shared/hero-button/hero-button.component.ts
@@ -8,7 +8,7 @@ import { Component } from '@angular/core';
   moduleId: module.id,
   // #docregion example
   selector: 'toh-hero-button',
-  templateUrl: 'hero-button.component.html'
+  templateUrl: './hero-button.component.html'
 })
 export class HeroButtonComponent {}
 // #enddocregion example
diff --git a/public/docs/_examples/style-guide/ts/05-03/app/app.component.ts b/public/docs/_examples/style-guide/ts/05-03/app/app.component.ts
index 03062c57fd..d57163f06f 100644
--- a/public/docs/_examples/style-guide/ts/05-03/app/app.component.ts
+++ b/public/docs/_examples/style-guide/ts/05-03/app/app.component.ts
@@ -3,6 +3,6 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'sg-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 export class AppComponent { }
diff --git a/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.avoid.ts b/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.avoid.ts
index 4cbf731912..34f2f08ca1 100644
--- a/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.avoid.ts
+++ b/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.avoid.ts
@@ -9,7 +9,7 @@ import { Component } from '@angular/core';
   moduleId: module.id,
   // #docregion example
   selector: '[tohHeroButton]',
-  templateUrl: 'hero-button.component.html'
+  templateUrl: './hero-button.component.html'
 })
 export class HeroButtonComponent {}
 // #enddocregion example
diff --git a/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.ts b/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.ts
index 439ce328d5..48de306193 100644
--- a/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.ts
+++ b/public/docs/_examples/style-guide/ts/05-03/app/heroes/shared/hero-button/hero-button.component.ts
@@ -8,7 +8,7 @@ import { Component } from '@angular/core';
   moduleId: module.id,
   // #docregion example
   selector: 'toh-hero-button',
-  templateUrl: 'hero-button.component.html'
+  templateUrl: './hero-button.component.html'
 })
 export class HeroButtonComponent {}
 // #enddocregion example
diff --git a/public/docs/_examples/style-guide/ts/05-04/app/heroes/heroes.component.ts b/public/docs/_examples/style-guide/ts/05-04/app/heroes/heroes.component.ts
index 9db7e50a35..ee5a414e1a 100644
--- a/public/docs/_examples/style-guide/ts/05-04/app/heroes/heroes.component.ts
+++ b/public/docs/_examples/style-guide/ts/05-04/app/heroes/heroes.component.ts
@@ -10,8 +10,8 @@ import { Hero } from './shared';
   moduleId: module.id,
   // #docregion example
   selector: 'toh-heroes',
-  templateUrl: 'heroes.component.html',
-  styleUrls:  ['heroes.component.css']
+  templateUrl: './heroes.component.html',
+  styleUrls:  ['./heroes.component.css']
 })
 export class HeroesComponent implements OnInit {
   heroes: Hero[];
diff --git a/public/docs/_examples/style-guide/ts/05-13/app/app.component.ts b/public/docs/_examples/style-guide/ts/05-13/app/app.component.ts
index 03062c57fd..d57163f06f 100644
--- a/public/docs/_examples/style-guide/ts/05-13/app/app.component.ts
+++ b/public/docs/_examples/style-guide/ts/05-13/app/app.component.ts
@@ -3,6 +3,6 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'sg-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 export class AppComponent { }
diff --git a/public/docs/_examples/style-guide/ts/05-16/app/app.component.ts b/public/docs/_examples/style-guide/ts/05-16/app/app.component.ts
index 03062c57fd..d57163f06f 100644
--- a/public/docs/_examples/style-guide/ts/05-16/app/app.component.ts
+++ b/public/docs/_examples/style-guide/ts/05-16/app/app.component.ts
@@ -3,6 +3,6 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'sg-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 export class AppComponent { }
diff --git a/public/docs/_examples/style-guide/ts/06-01/app/app.component.ts b/public/docs/_examples/style-guide/ts/06-01/app/app.component.ts
index 03062c57fd..d57163f06f 100644
--- a/public/docs/_examples/style-guide/ts/06-01/app/app.component.ts
+++ b/public/docs/_examples/style-guide/ts/06-01/app/app.component.ts
@@ -3,6 +3,6 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'sg-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 export class AppComponent { }
diff --git a/public/docs/_examples/style-guide/ts/07-01/app/app.component.ts b/public/docs/_examples/style-guide/ts/07-01/app/app.component.ts
index 5b10b49c37..638da66caf 100644
--- a/public/docs/_examples/style-guide/ts/07-01/app/app.component.ts
+++ b/public/docs/_examples/style-guide/ts/07-01/app/app.component.ts
@@ -5,7 +5,7 @@ import { Hero, HeroService } from './heroes';
 @Component({
   moduleId: module.id,
   selector: 'sg-app',
-  templateUrl: 'app.component.html',
+  templateUrl: './app.component.html',
   providers: [HeroService]
 })
 export class AppComponent implements OnInit {
diff --git a/public/docs/_examples/style-guide/ts/app/app.component.ts b/public/docs/_examples/style-guide/ts/app/app.component.ts
index be8d89aff7..ab2d3d9c33 100644
--- a/public/docs/_examples/style-guide/ts/app/app.component.ts
+++ b/public/docs/_examples/style-guide/ts/app/app.component.ts
@@ -3,6 +3,6 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 export class AppComponent { }
diff --git a/public/docs/_examples/template-syntax/ts/app/app.component.ts b/public/docs/_examples/template-syntax/ts/app/app.component.ts
index 77221587a7..45ab0fc695 100644
--- a/public/docs/_examples/template-syntax/ts/app/app.component.ts
+++ b/public/docs/_examples/template-syntax/ts/app/app.component.ts
@@ -19,7 +19,7 @@ export enum Color {Red, Green, Blue};
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 export class AppComponent implements AfterViewInit, OnInit {
 
diff --git a/public/docs/_examples/testing/ts/app/app.component.ts b/public/docs/_examples/testing/ts/app/app.component.ts
index 42e09d0fe4..a917088410 100644
--- a/public/docs/_examples/testing/ts/app/app.component.ts
+++ b/public/docs/_examples/testing/ts/app/app.component.ts
@@ -3,6 +3,6 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 export class AppComponent { }
diff --git a/public/docs/_examples/testing/ts/app/bag/bag.ts b/public/docs/_examples/testing/ts/app/bag/bag.ts
index 55731e33bd..a3fc0964fa 100644
--- a/public/docs/_examples/testing/ts/app/bag/bag.ts
+++ b/public/docs/_examples/testing/ts/app/bag/bag.ts
@@ -251,7 +251,7 @@ export class TestViewProvidersComponent {
 @Component({
   moduleId: module.id,
   selector: 'external-template-comp',
-  templateUrl: 'bag-external-template.html'
+  templateUrl: './bag-external-template.html'
 })
 export class ExternalTemplateComponent implements OnInit {
   serviceValue: string;
@@ -275,7 +275,7 @@ export class InnerCompWithExternalTemplateComponent { }
 @Component({
   moduleId: module.id,
   selector: 'bad-template-comp',
-  templateUrl: 'non-existant.html'
+  templateUrl: './non-existant.html'
 })
 export class BadTemplateUrlComponent { }
 
diff --git a/public/docs/_examples/testing/ts/app/banner.component.ts b/public/docs/_examples/testing/ts/app/banner.component.ts
index a8c0023189..333f37bbcd 100644
--- a/public/docs/_examples/testing/ts/app/banner.component.ts
+++ b/public/docs/_examples/testing/ts/app/banner.component.ts
@@ -4,8 +4,8 @@ import { Component } from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'app-banner',
-  templateUrl: 'banner.component.html',
-  styleUrls:  ['banner.component.css']
+  templateUrl: './banner.component.html',
+  styleUrls:  ['./banner.component.css']
 })
 export class BannerComponent {
   title = 'Test Tour of Heroes';
diff --git a/public/docs/_examples/testing/ts/app/dashboard/dashboard-hero.component.ts b/public/docs/_examples/testing/ts/app/dashboard/dashboard-hero.component.ts
index 6363058f75..4a8c4974fd 100644
--- a/public/docs/_examples/testing/ts/app/dashboard/dashboard-hero.component.ts
+++ b/public/docs/_examples/testing/ts/app/dashboard/dashboard-hero.component.ts
@@ -7,8 +7,8 @@ import { Hero } from '../model';
 @Component({
   moduleId: module.id,
   selector:    'dashboard-hero',
-  templateUrl: 'dashboard-hero.component.html',
-  styleUrls: [ 'dashboard-hero.component.css' ]
+  templateUrl: './dashboard-hero.component.html',
+  styleUrls: [ './dashboard-hero.component.css' ]
 })
 export class DashboardHeroComponent {
   @Input() hero: Hero;
diff --git a/public/docs/_examples/testing/ts/app/dashboard/dashboard.component.ts b/public/docs/_examples/testing/ts/app/dashboard/dashboard.component.ts
index a0f08df120..40581094f6 100644
--- a/public/docs/_examples/testing/ts/app/dashboard/dashboard.component.ts
+++ b/public/docs/_examples/testing/ts/app/dashboard/dashboard.component.ts
@@ -7,8 +7,8 @@ import { Hero, HeroService } from '../model';
 @Component({
   moduleId: module.id,
   selector: 'app-dashboard',
-  templateUrl: 'dashboard.component.html',
-  styleUrls: [ 'dashboard.component.css' ]
+  templateUrl: './dashboard.component.html',
+  styleUrls: [ './dashboard.component.css' ]
 })
 export class DashboardComponent implements OnInit {
 
diff --git a/public/docs/_examples/testing/ts/app/hero/hero-detail.component.ts b/public/docs/_examples/testing/ts/app/hero/hero-detail.component.ts
index 8c7a58a512..cb09da00ae 100644
--- a/public/docs/_examples/testing/ts/app/hero/hero-detail.component.ts
+++ b/public/docs/_examples/testing/ts/app/hero/hero-detail.component.ts
@@ -11,8 +11,8 @@ import { HeroDetailService } from './hero-detail.service';
 @Component({
   moduleId: module.id,
   selector:    'app-hero-detail',
-  templateUrl: 'hero-detail.component.html',
-  styleUrls:  ['hero-detail.component.css' ],
+  templateUrl: './hero-detail.component.html',
+  styleUrls:  ['./hero-detail.component.css' ],
   providers:  [ HeroDetailService ]
 })
 export class HeroDetailComponent implements OnInit {
diff --git a/public/docs/_examples/testing/ts/app/hero/hero-list.component.ts b/public/docs/_examples/testing/ts/app/hero/hero-list.component.ts
index 623cbaf5fd..501e0000b6 100644
--- a/public/docs/_examples/testing/ts/app/hero/hero-list.component.ts
+++ b/public/docs/_examples/testing/ts/app/hero/hero-list.component.ts
@@ -6,8 +6,8 @@ import { Hero, HeroService } from '../model';
 @Component({
   moduleId: module.id,
   selector: 'app-heroes',
-  templateUrl: 'hero-list.component.html',
-  styleUrls: [ 'hero-list.component.css' ]
+  templateUrl: './hero-list.component.html',
+  styleUrls: [ './hero-list.component.css' ]
 })
 export class HeroListComponent implements OnInit {
   heroes: Promise<Hero[]>;
diff --git a/public/docs/_examples/toh-5/ts/app/app.component.ts b/public/docs/_examples/toh-5/ts/app/app.component.ts
index e0cb229f57..c3f92ec46b 100644
--- a/public/docs/_examples/toh-5/ts/app/app.component.ts
+++ b/public/docs/_examples/toh-5/ts/app/app.component.ts
@@ -15,7 +15,7 @@ import { Component } from '@angular/core';
   `,
   // #enddocregion template
   // #docregion styleUrls
-  styleUrls: ['app.component.css'],
+  styleUrls: ['./app.component.css'],
   // #enddocregion styleUrls
 })
 export class AppComponent {
diff --git a/public/docs/_examples/toh-5/ts/app/dashboard.component.ts b/public/docs/_examples/toh-5/ts/app/dashboard.component.ts
index 3ca1630f70..eb026eb6be 100644
--- a/public/docs/_examples/toh-5/ts/app/dashboard.component.ts
+++ b/public/docs/_examples/toh-5/ts/app/dashboard.component.ts
@@ -10,10 +10,10 @@ import { HeroService } from './hero.service';
 @Component({
   moduleId: module.id,
   selector: 'my-dashboard',
-  templateUrl: 'dashboard.component.html',
+  templateUrl: './dashboard.component.html',
   // #enddocregion metadata
   // #docregion css
-  styleUrls: [ 'dashboard.component.css' ]
+  styleUrls: [ './dashboard.component.css' ]
   // #enddocregion css
   // #docregion metadata
 })
diff --git a/public/docs/_examples/toh-5/ts/app/hero-detail.component.ts b/public/docs/_examples/toh-5/ts/app/hero-detail.component.ts
index 3557aa31d5..5b9bea89fa 100644
--- a/public/docs/_examples/toh-5/ts/app/hero-detail.component.ts
+++ b/public/docs/_examples/toh-5/ts/app/hero-detail.component.ts
@@ -12,9 +12,9 @@ import { HeroService }  from './hero.service';
 @Component({
   moduleId: module.id,
   selector: 'my-hero-detail',
-  templateUrl: 'hero-detail.component.html',
+  templateUrl: './hero-detail.component.html',
   // #enddocregion metadata, v2
-  styleUrls: [ 'hero-detail.component.css' ]
+  styleUrls: [ './hero-detail.component.css' ]
   // #docregion metadata, v2
 })
 // #enddocregion metadata
diff --git a/public/docs/_examples/toh-5/ts/app/heroes.component.ts b/public/docs/_examples/toh-5/ts/app/heroes.component.ts
index 1f2290c853..ab6928addd 100644
--- a/public/docs/_examples/toh-5/ts/app/heroes.component.ts
+++ b/public/docs/_examples/toh-5/ts/app/heroes.component.ts
@@ -13,8 +13,8 @@ import { HeroService } from './hero.service';
   // #docregion renaming
   selector: 'my-heroes',
   // #enddocregion renaming
-  templateUrl: 'heroes.component.html',
-  styleUrls: [ 'heroes.component.css' ]
+  templateUrl: './heroes.component.html',
+  styleUrls: [ './heroes.component.css' ]
   // #docregion renaming
 })
 // #enddocregion metadata
diff --git a/public/docs/_examples/toh-6/ts/app/app.component.ts b/public/docs/_examples/toh-6/ts/app/app.component.ts
index c9bb797d62..d8a8507985 100644
--- a/public/docs/_examples/toh-6/ts/app/app.component.ts
+++ b/public/docs/_examples/toh-6/ts/app/app.component.ts
@@ -13,7 +13,7 @@ import { Component }          from '@angular/core';
     </nav>
     <router-outlet></router-outlet>
   `,
-  styleUrls: ['app.component.css']
+  styleUrls: ['./app.component.css']
 })
 export class AppComponent {
   title = 'Tour of Heroes';
diff --git a/public/docs/_examples/toh-6/ts/app/dashboard.component.ts b/public/docs/_examples/toh-6/ts/app/dashboard.component.ts
index a66ec3b89b..1eb93f9c01 100644
--- a/public/docs/_examples/toh-6/ts/app/dashboard.component.ts
+++ b/public/docs/_examples/toh-6/ts/app/dashboard.component.ts
@@ -7,8 +7,8 @@ import { HeroService } from './hero.service';
 @Component({
   moduleId: module.id,
   selector: 'my-dashboard',
-  templateUrl: 'dashboard.component.html',
-  styleUrls: [ 'dashboard.component.css' ]
+  templateUrl: './dashboard.component.html',
+  styleUrls: [ './dashboard.component.css' ]
 })
 // #enddocregion search
 export class DashboardComponent implements OnInit {
diff --git a/public/docs/_examples/toh-6/ts/app/hero-detail.component.ts b/public/docs/_examples/toh-6/ts/app/hero-detail.component.ts
index a0342415f2..3f1c7b72f9 100644
--- a/public/docs/_examples/toh-6/ts/app/hero-detail.component.ts
+++ b/public/docs/_examples/toh-6/ts/app/hero-detail.component.ts
@@ -10,8 +10,8 @@ import { HeroService } from './hero.service';
 @Component({
   moduleId: module.id,
   selector: 'my-hero-detail',
-  templateUrl: 'hero-detail.component.html',
-  styleUrls: [ 'hero-detail.component.css' ]
+  templateUrl: './hero-detail.component.html',
+  styleUrls: [ './hero-detail.component.css' ]
 })
 export class HeroDetailComponent implements OnInit {
   hero: Hero;
diff --git a/public/docs/_examples/toh-6/ts/app/hero-search.component.ts b/public/docs/_examples/toh-6/ts/app/hero-search.component.ts
index bcb04ad549..78c490ef93 100644
--- a/public/docs/_examples/toh-6/ts/app/hero-search.component.ts
+++ b/public/docs/_examples/toh-6/ts/app/hero-search.component.ts
@@ -11,8 +11,8 @@ import { Hero } from './hero';
 @Component({
   moduleId: module.id,
   selector: 'hero-search',
-  templateUrl: 'hero-search.component.html',
-  styleUrls: [ 'hero-search.component.css' ],
+  templateUrl: './hero-search.component.html',
+  styleUrls: [ './hero-search.component.css' ],
   providers: [HeroSearchService]
 })
 export class HeroSearchComponent implements OnInit {
diff --git a/public/docs/_examples/toh-6/ts/app/heroes.component.ts b/public/docs/_examples/toh-6/ts/app/heroes.component.ts
index c8ff6973c0..2a92adfaa8 100644
--- a/public/docs/_examples/toh-6/ts/app/heroes.component.ts
+++ b/public/docs/_examples/toh-6/ts/app/heroes.component.ts
@@ -8,8 +8,8 @@ import { HeroService }         from './hero.service';
 @Component({
   moduleId: module.id,
   selector: 'my-heroes',
-  templateUrl: 'heroes.component.html',
-  styleUrls: [ 'heroes.component.css' ]
+  templateUrl: './heroes.component.html',
+  styleUrls: [ './heroes.component.css' ]
 })
 export class HeroesComponent implements OnInit {
   heroes: Hero[];
diff --git a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.ts b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.ts
index 98f05ca599..16a2a87f7f 100644
--- a/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.ts
+++ b/public/docs/_examples/upgrade-phonecat-2-hybrid/ts/app/phone-detail/phone-detail.component.ts
@@ -14,7 +14,7 @@ import { Phone, PhoneData } from '../core/phone/phone.service';
 @Component({
   moduleId: module.id,
   selector: 'phone-detail',
-  templateUrl: 'phone-detail.template.html',
+  templateUrl: './phone-detail.template.html',
   // #enddocregion initialclass
   // #docregion initialclass
 })
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.component.ts b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.component.ts
index ceba9a6f70..579dd5601e 100644
--- a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.component.ts
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-detail/phone-detail.component.ts
@@ -8,7 +8,7 @@ import { Phone, PhoneData } from '../core/phone/phone.service';
 @Component({
   moduleId: module.id,
   selector: 'phone-detail',
-  templateUrl: 'phone-detail.template.html'
+  templateUrl: './phone-detail.template.html'
 })
 export class PhoneDetailComponent {
   phone: PhoneData;
diff --git a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-list/phone-list.component.ts b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-list/phone-list.component.ts
index abbe27c5f2..f5dca210d8 100644
--- a/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-list/phone-list.component.ts
+++ b/public/docs/_examples/upgrade-phonecat-3-final/ts/app/phone-list/phone-list.component.ts
@@ -7,7 +7,7 @@ import { Phone, PhoneData } from '../core/phone/phone.service';
 @Component({
   moduleId: module.id,
   selector: 'phone-list',
-  templateUrl: 'phone-list.template.html',
+  templateUrl: './phone-list.template.html',
 })
 // #enddocregion top
 export class PhoneListComponent {
diff --git a/public/docs/_examples/user-input/ts/app/app.component.ts b/public/docs/_examples/user-input/ts/app/app.component.ts
index 9368e33455..56906ef048 100644
--- a/public/docs/_examples/user-input/ts/app/app.component.ts
+++ b/public/docs/_examples/user-input/ts/app/app.component.ts
@@ -4,6 +4,6 @@ import { Component }           from '@angular/core';
 @Component({
   moduleId: module.id,
   selector: 'my-app',
-  templateUrl: 'app.component.html'
+  templateUrl: './app.component.html'
 })
 export class AppComponent { }
diff --git a/public/docs/ts/latest/cookbook/component-relative-paths.jade b/public/docs/ts/latest/cookbook/component-relative-paths.jade
index b37a95ef98..4a0f08bde9 100644
--- a/public/docs/ts/latest/cookbook/component-relative-paths.jade
+++ b/public/docs/ts/latest/cookbook/component-relative-paths.jade
@@ -64,7 +64,8 @@ include ../_util-fns
   relative to the component class file simply by setting the `moduleId` property of the `@Component` metadata like this
 +makeExample('cb-component-relative-paths/ts/app/some.component.ts','module-id')(format='.')
 :marked
-  We strip the `app/` base path from the `templateUrl` and `styleUrls`. The result looks like this:
+  We strip the `app/` base path from the `templateUrl` and `styleUrls` and replace it with `./`. 
+  The result looks like this:
 +makeExample('cb-component-relative-paths/ts/app/some.component.ts','relative-config')(format='.')
 
 .alert.is-helpful
diff --git a/public/docs/ts/latest/cookbook/ts-to-js.jade b/public/docs/ts/latest/cookbook/ts-to-js.jade
index 2413f80ba0..a31ec9c837 100644
--- a/public/docs/ts/latest/cookbook/ts-to-js.jade
+++ b/public/docs/ts/latest/cookbook/ts-to-js.jade
@@ -249,7 +249,7 @@ a#class-metadata
   `)(format='.')
 
 :marked
-  Note that the _TypeScript_ and both _ES6_ `templateUrl` properties identify the location of the template file _relative to the component module_.
+  Note that both the _TypeScript_ and _ES6_ `templateUrl` properties identify the location of the template file _relative to the component module_.
   All three metadata configurations specify the `moduleId` property 
   so that Angular can calculate the proper module address.