(chore): removing sass rollup, adding hmr, fix linting errors

package.json

@@ -56,10 +56,12 @@
     "zone.js": "0.6.17"
   },
   "devDependencies": {
+    "@angularclass/hmr": "^1.0.1",
+    "@angularclass/hmr-loader": "^1.0.1",
     "@types/core-js": "^0.9.28",
     "@types/node": "^6.0.31",
     "autoprefixer": "^6.3.7",
-    "awesome-typescript-loader": "^2.0.3",
+    "awesome-typescript-loader": "^2.2.1",
     "css-loader": "^0.12.0",
     "html-webpack-plugin": "^2.22.0",
     "node-sass": "^3.7.0",
@@ -69,7 +71,6 @@
     "rimraf": "^2.5.2",
     "rollup": "^0.34.1",
     "progress-bar-webpack-plugin": "^1.9.0",
-    "rollup-plugin-sass": "^0.1.1",
     "rollup-plugin-sourcemaps": "^0.3.5",
     "rollup-plugin-typescript": "^0.8.0",
     "sass-loader": "^4.0.0",
@@ -78,8 +79,8 @@
     "ts-helpers": "1.1.1",
     "tslint": "3.15.1",
     "tslint-loader": "^2.1.5",
-    "typescript": "^2.0.0",
-    "webpack": "2.1.0-beta.20",
+    "typescript": "2.0.0",
+    "webpack": "2.1.0-beta.21",
     "webpack-dev-server": "2.1.0-beta.0",
     "webpack-notifier": "^1.4.0"
   }

rollup.config.js

@@ -2,7 +2,6 @@
 
 var typescript = require('rollup-plugin-typescript');
 var sourcemaps = require('rollup-plugin-sourcemaps');
-var sass = require('rollup-plugin-sass');
 var pkg = require('./package.json');
 
 var banner =
@@ -49,7 +48,6 @@ module.exports = {
     typescript({
       typescript: require('typescript')
     }),
-    sourcemaps(),
-    sass()
+    sourcemaps()
   ]
 }

src/demos/bootstrap.ts

@@ -1,8 +1,13 @@
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+import { bootloader } from '@angularclass/hmr';
+
 import { AppModule } from './module';
 
-// bootstrap when document is ready
-document.addEventListener('DOMContentLoaded', () => {
-  platformBrowserDynamic()
-    .bootstrapModule(AppModule);
-});
+export function main(): Promise<any> {
+  return platformBrowserDynamic()
+    .bootstrapModule(AppModule)
+    .catch(err => console.error(err));
+}
+
+if(HMR) bootloader(main);
+if(!HMR) main();

src/demos/module.ts

@@ -1,5 +1,6 @@
-import { NgModule } from '@angular/core';
+import { NgModule, ApplicationRef } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
+import { removeNgStyles, createNewHosts } from '@angularclass/hmr';
 
 import { Angular2DataTableModule } from '../angular2-data-table';
 import '../components/datatable.scss';
@@ -16,8 +17,23 @@ import { App } from './basic';
 // import { App } from './scrolling';
 
 @NgModule({
-  declarations: [ App ],
-  imports: [ BrowserModule, Angular2DataTableModule ],
-  bootstrap: [ App ]
+  declarations: [App],
+  imports: [BrowserModule, Angular2DataTableModule],
+  bootstrap: [App]
 })
-export class AppModule { }
+export class AppModule {
+
+  constructor(private appRef: ApplicationRef) {
+  }
+
+  hmrOnDestroy(store) {
+    const cmpLocation = this.appRef.components.map(cmp => cmp.location.nativeElement);
+    store.disposeOldHosts = createNewHosts(cmpLocation);
+    removeNgStyles();
+  }
+
+  hmrAfterDestroy(store) {
+    store.disposeOldHosts();
+    delete store.disposeOldHosts;
+  }
+}

src/types.d.ts

@@ -3,6 +3,7 @@
 declare var ENV: string;
 declare var APP_VERSION: string;
 declare var IS_PRODUCTION: boolean;
+declare var HMR: boolean;
 
 interface ErrorStackTraceLimit {
   stackTraceLimit: number;

tsconfig.json

@@ -29,5 +29,8 @@
     "node_modules"
   ],
   "compileOnSave": false,
-  "buildOnSave": false
+  "buildOnSave": false,
+  "awesomeTypescriptLoaderOptions": {
+    "forkChecker": false
+  }
 }

tslint.json

@@ -17,6 +17,7 @@
       "check-separator",
       "check-type"
     ],
+    "only-arrow-functions": false,
     "no-string-literal": false,
     "no-unused-new": false,
     "no-console": [true, "warn"],

webpack.config.js

@@ -68,11 +68,18 @@ function webpackConfig(options = {}) {
       }],
       loaders: [{
         test: /\.ts$/,
-        loader: 'awesome-typescript-loader',
+        loaders: [
+          'awesome-typescript-loader',
+          '@angularclass/hmr-loader'
+        ],
         exclude: /(node_modules)/
       }, {
         test: /\.scss$/,
-        loaders: ['style', 'css?sourceMap', 'sass?sourceMap']
+        loaders: [
+          'style',
+          'css?sourceMap',
+          'sass?sourceMap'
+        ]
       }]
     },
 
@@ -86,6 +93,7 @@ function webpackConfig(options = {}) {
 
       new webpack.DefinePlugin({
         'ENV': JSON.stringify(ENV),
+        'HMR': options.HMR,
         'IS_PRODUCTION': IS_PRODUCTION,
         'APP_VERSION': VERSION
       }),
@@ -104,7 +112,7 @@ function webpackConfig(options = {}) {
       failOnHint: false,
       resourcePath: 'src'
     }
-  }
+  };
 
 };