feat(aot): aot compilation work in progress

src/app/pages/dashboard/calendar/calendar.component.ts

@@ -1,12 +1,12 @@
 import {Component, ViewEncapsulation} from '@angular/core';
 
 import {CalendarService} from './calendar.service';
+import 'style!./calendar.scss';
 
 @Component({
   selector: 'calendar',
-  encapsulation: ViewEncapsulation.None,
-  styles: [require('./calendar.scss')],
-  template: require('./calendar.html')
+  // // encapsulation: ViewEncapsulation.None,
+  templateUrl: './calendar.html'
 })
 export class Calendar {
 

src/app/pages/dashboard/dashboard.component.ts

@@ -1,10 +1,9 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
 
 @Component({
   selector: 'dashboard',
-  encapsulation: ViewEncapsulation.None,
-  styles: [require('./dashboard.scss')],
-  template: require('./dashboard.html')
+  styleUrls: ['./dashboard.scss'],
+  templateUrl: './dashboard.html'
 })
 export class Dashboard {
 

src/app/pages/dashboard/dashboard.module.ts

@@ -50,4 +50,4 @@ import { UsersMapService } from './usersMap/usersMap.service';
     UsersMapService
   ]
 })
-export default class DashboardModule {}
+export class DashboardModule {}

src/app/pages/dashboard/dashboard.routing.ts

@@ -1,9 +1,10 @@
 import { Routes, RouterModule }  from '@angular/router';
 
 import { Dashboard } from './dashboard.component';
+import { ModuleWithProviders } from '@angular/core';
 
 // noinspection TypeScriptValidateTypes
-const routes: Routes = [
+export const routes: Routes = [
   {
     path: '',
     component: Dashboard,
@@ -13,4 +14,4 @@ const routes: Routes = [
   }
 ];
 
-export const routing = RouterModule.forChild(routes);
+export const routing: ModuleWithProviders = RouterModule.forChild(routes);

src/app/pages/dashboard/feed/feed.component.ts

@@ -4,9 +4,9 @@ import {FeedService} from './feed.service';
 
 @Component({
   selector: 'feed',
-  encapsulation: ViewEncapsulation.None,
-  styles: [require('./feed.scss')],
-  template: require('./feed.html')
+  // // encapsulation: ViewEncapsulation.None,
+  styleUrls: ['./feed.scss'],
+  templateUrl: './feed.html'
 })
 export class Feed {
 

src/app/pages/dashboard/lineChart/lineChart.component.ts

@@ -1,12 +1,12 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
 
 import {LineChartService} from './lineChart.service';
 
+import 'style!./lineChart.scss';
+
 @Component({
   selector: 'line-chart',
-  encapsulation: ViewEncapsulation.None,
-  styles: [require('./lineChart.scss')],
-  template: require('./lineChart.html')
+  templateUrl: './lineChart.html'
 })
 export class LineChart {
 

src/app/pages/dashboard/pieChart/pieChart.component.ts

@@ -3,12 +3,11 @@ import {Component, ViewEncapsulation} from '@angular/core';
 import {PieChartService} from './pieChart.service';
 
 import './pieChart.loader.ts';
+import 'style!./pieChart.scss';
 
 @Component({
   selector: 'pie-chart',
-  encapsulation: ViewEncapsulation.None,
-  styles: [require('./pieChart.scss')],
-  template: require('./pieChart.html')
+  templateUrl: './pieChart.html'
 })
 // TODO: move easypiechart to component
 export class PieChart {

src/app/pages/dashboard/pieChart/pieChart.loader.ts

@@ -1 +1 @@
-require('easy-pie-chart/dist/jquery.easypiechart.js');
+import 'easy-pie-chart/dist/jquery.easypiechart.js';

src/app/pages/dashboard/popularApp/popularApp.component.ts

@@ -1,10 +1,9 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
+import 'style!./popularApp.scss';
 
 @Component({
   selector: 'popular-app',
-  encapsulation: ViewEncapsulation.None,
-  styles: [require('./popularApp.scss')],
-  template: require('./popularApp.html')
+  templateUrl: './popularApp.html'
 })
 export class PopularApp {
 

src/app/pages/dashboard/todo/todo.component.ts

@@ -5,12 +5,12 @@ import {TodoService} from './todo.service';
 
 @Component({
   selector: 'todo',
-  encapsulation: ViewEncapsulation.None,
-  styles: [require('./todo.scss')],
-  template: require('./todo.html')
+  // encapsulation: ViewEncapsulation.None,
+  styleUrls: ['./todo.scss'],
+  templateUrl: './todo.html'
 })
 export class Todo {
-  
+
   public dashboardColors = this._baConfig.get().colors.dashboard;
 
   public todoList:Array<any>;

src/app/pages/dashboard/trafficChart/trafficChart.component.ts

@@ -1,13 +1,14 @@
 import {Component, ViewEncapsulation, ElementRef} from '@angular/core';
 
-import {Chart} from './trafficChart.loader.ts';
+import './trafficChart.loader.ts';
 import {TrafficChartService} from './trafficChart.service';
+import * as Chart from 'chart.js';
 
 @Component({
   selector: 'traffic-chart',
-  encapsulation: ViewEncapsulation.None,
-  styles: [require('./trafficChart.scss')],
-  template: require('./trafficChart.html')
+  // encapsulation: ViewEncapsulation.None,
+  styleUrls: ['./trafficChart.scss'],
+  templateUrl: './trafficChart.html'
 })
 
 // TODO: move chart.js to it's own component

src/app/pages/dashboard/trafficChart/trafficChart.loader.ts

@@ -1 +1,3 @@
-export const Chart = require('chart.js');
+
+
+

src/app/pages/dashboard/usersMap/usersMap.component.ts

@@ -1,12 +1,11 @@
-import {Component, ViewEncapsulation} from '@angular/core';
+import {Component} from '@angular/core';
 
 import {UsersMapService} from './usersMap.service';
+import 'style!./usersMap.scss';
 
 @Component({
   selector: 'users-map',
-  encapsulation: ViewEncapsulation.None,
-  styles: [require('./usersMap.scss')],
-  template: require('./usersMap.html')
+  templateUrl: './usersMap.html'
 })
 export class UsersMap {