perf: Migration to angular 6

.travis.yml

@@ -12,7 +12,7 @@ addons:
 language: node_js
 
 node_js:
-  - "7"
+  - "8"
 
 before_script:
   - export DISPLAY=:99.0

angular.json

@@ -0,0 +1,138 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "rxjs-docs": {
+      "root": "",
+      "sourceRoot": "src",
+      "projectType": "application",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "dist",
+            "index": "src/index.html",
+            "main": "src/main.ts",
+            "tsConfig": "src/tsconfig.app.json",
+            "polyfills": "src/polyfills.ts",
+            "assets": [
+              "src/assets",
+              "src/manifest.json",
+              "src/favicon.ico"
+            ],
+            "styles": [
+              "src/theme.scss",
+              "src/styles.scss"
+            ],
+            "scripts": []
+          },
+          "configurations": {
+            "production": {
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": false,
+              "extractCss": true,
+              "namedChunks": false,
+              "aot": true,
+              "extractLicenses": true,
+              "vendorChunk": false,
+              "buildOptimizer": true,
+              "serviceWorker": true,
+              "ngswConfigPath": "src/ngsw-config.json",
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.prod.ts"
+                }
+              ]
+            }
+          }
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "options": {
+            "browserTarget": "rxjs-docs:build"
+          },
+          "configurations": {
+            "production": {
+              "browserTarget": "rxjs-docs:build:production"
+            }
+          }
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "options": {
+            "browserTarget": "rxjs-docs:build"
+          }
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "src/test.ts",
+            "karmaConfig": "./karma.conf.js",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "src/tsconfig.spec.json",
+            "scripts": [],
+            "styles": [
+              "src/theme.scss",
+              "src/styles.scss"
+            ],
+            "assets": [
+              "src/assets",
+              "src/manifest.json",
+              "src/favicon.ico"
+            ]
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [
+              "src/tsconfig.app.json",
+              "src/tsconfig.spec.json"
+            ],
+            "exclude": [
+              "**/node_modules/**"
+            ]
+          }
+        }
+      }
+    },
+    "rxjs-docs-e2e": {
+      "root": "",
+      "sourceRoot": "",
+      "projectType": "application",
+      "architect": {
+        "e2e": {
+          "builder": "@angular-devkit/build-angular:protractor",
+          "options": {
+            "protractorConfig": "./protractor.conf.js",
+            "devServerTarget": "rxjs-docs:serve"
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [
+              "e2e/tsconfig.e2e.json"
+            ],
+            "exclude": [
+              "**/node_modules/**"
+            ]
+          }
+        }
+      }
+    }
+  },
+  "defaultProject": "rxjs-docs",
+  "schematics": {
+    "@schematics/angular:component": {
+      "prefix": "app",
+      "styleext": "scss"
+    },
+    "@schematics/angular:directive": {
+      "prefix": "app"
+    }
+  }
+}

karma.conf.js

@@ -4,19 +4,19 @@
 module.exports = function (config) {
   config.set({
     basePath: '',
-    frameworks: ['jasmine', '@angular/cli'],
+    frameworks: ['jasmine', '@angular-devkit/build-angular'],
     plugins: [
       require('karma-jasmine'),
       require('karma-chrome-launcher'),
       require('karma-jasmine-html-reporter'),
       require('karma-coverage-istanbul-reporter'),
-      require('@angular/cli/plugins/karma')
+      require('@angular-devkit/build-angular/plugins/karma')
     ],
     client:{
       clearContext: false // leave Jasmine Spec Runner output visible in browser
     },
     coverageIstanbulReporter: {
-      reports: [ 'html', 'lcovonly' ],
+      dir: require('path').join(__dirname, 'coverage'), reports: [ 'html', 'lcovonly' ],
       fixWebpackSourcePaths: true
     },
     angularCli: {

package.json

@@ -27,32 +27,34 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "5.2.2",
-    "@angular/cdk": "5.1.0",
-    "@angular/common": "5.2.2",
-    "@angular/compiler": "5.2.2",
-    "@angular/core": "5.2.2",
-    "@angular/flex-layout": "5.0.0-beta.13",
-    "@angular/forms": "5.2.2",
-    "@angular/http": "5.2.2",
-    "@angular/material": "5.1.0",
-    "@angular/platform-browser": "5.2.2",
-    "@angular/platform-browser-dynamic": "5.2.2",
-    "@angular/router": "5.2.2",
-    "@angular/service-worker": "5.2.2",
+    "@angular/animations": "6.0.0",
+    "@angular/cdk": "6.0.1",
+    "@angular/common": "6.0.0",
+    "@angular/compiler": "6.0.0",
+    "@angular/core": "6.0.0",
+    "@angular/flex-layout": "5.0.0-beta.14",
+    "@angular/forms": "6.0.0",
+    "@angular/http": "6.0.0",
+    "@angular/material": "6.0.1",
+    "@angular/platform-browser": "6.0.0",
+    "@angular/platform-browser-dynamic": "6.0.0",
+    "@angular/router": "6.0.0",
+    "@angular/service-worker": "6.0.0",
     "@ngx-translate/core": "9.1.1",
     "@ngx-translate/http-loader": "2.0.1",
     "@types/hammerjs": "2.0.35",
     "core-js": "2.4.1",
     "hammerjs": "2.0.8",
-    "rxjs": "5.5.5",
+    "rxjs": "^6.1.0",
+    "rxjs-compat": "6.1.0",
     "ts-loader": "3.1.1",
-    "zone.js": "0.8.14"
+    "zone.js": "^0.8.26"
   },
   "devDependencies": {
-    "@angular/cli": "1.7",
-    "@angular/compiler-cli": "5.2.2",
-    "@angular/language-service": "5.2.2",
+    "@angular-devkit/build-angular": "~0.6.0",
+    "@angular/cli": "6.0.0",
+    "@angular/compiler-cli": "6.0.0",
+    "@angular/language-service": "6.0.0",
     "@types/jasmine": "2.5.53",
     "@types/jasminewd2": "2.0.2",
     "@types/lodash": "4.14.77",
@@ -80,7 +82,7 @@
     "ts-node": "3.2.0",
     "tslint": "5.3.2",
     "tslint-config-prettier": "1.6.0",
-    "typescript": "2.6.2",
+    "typescript": "2.7.2",
     "validate-commit-msg": "2.14.0",
     "wallaby-webpack": "*"
   },

src/app/companies/companies.component.ts

@@ -1,6 +1,6 @@
 import { COMPANIES_LIST } from './companies-list';
 import { Component, OnInit } from '@angular/core';
-import { Observable } from 'rxjs/Observable';
+import { Observable } from 'rxjs';
 import { MatDialog } from '@angular/material';
 
 import { CompanyService } from './company.service';

src/app/companies/company.service.ts

@@ -1,6 +1,5 @@
 import { Injectable } from '@angular/core';
-import { Observable } from 'rxjs/Observable';
-import { of } from 'rxjs/observable/of';
+import { Observable, of } from 'rxjs';
 import { COMPANIES_LIST } from './companies-list';
 import { Company } from './companies.model';
 

src/app/core/services/operator-menu.service.ts

@@ -1,5 +1,5 @@
 import { Injectable } from '@angular/core';
-import { Subject } from 'rxjs/Subject';
+import { Subject } from 'rxjs';
 
 @Injectable()
 export class OperatorMenuService {

src/app/core/services/operators.service.ts

@@ -1,7 +1,6 @@
 import { Injectable } from '@angular/core';
 
-import { Observable } from 'rxjs/Observable';
-import { BehaviorSubject } from 'rxjs/BehaviorSubject';
+import { Observable, BehaviorSubject } from 'rxjs';
 
 import { OperatorDoc } from '../../../operator-docs';
 import { LanguageService } from './language.service';

src/app/operators/components/operator/operator.component.ts

@@ -14,7 +14,7 @@ import {
 } from '../../../../operator-docs/operator.model';
 import { OperatorParameters } from '../../../../operator-docs';
 import { OperatorsService } from '../../../core/services/operators.service';
-import { Subscription } from 'rxjs/Subscription';
+import { Subscription } from 'rxjs';
 
 @Component({
   selector: 'app-operator',

src/app/operators/operators.component.ts

@@ -15,8 +15,7 @@ import {
 } from '@angular/animations';
 import { BreakpointObserver } from '@angular/cdk/layout';
 import { MatSidenav } from '@angular/material';
-import { Subject } from 'rxjs/Subject';
-import { Observable } from 'rxjs/Observable';
+import { Subject, Observable } from 'rxjs';
 import { filter, takeUntil, map } from 'rxjs/operators';
 
 import { OperatorDoc } from '../../operator-docs';

src/app/team/team.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core';
-import { Observable } from 'rxjs/Observable';
+import { Observable } from 'rxjs';
 
 import { TeamService } from './team.service';
 import { Team } from './team.models';

src/app/team/team.service.ts

@@ -1,6 +1,5 @@
 import { Injectable } from '@angular/core';
-import { Observable } from 'rxjs/Observable';
-import { of } from 'rxjs/observable/of';
+import { Observable, of } from 'rxjs';
 
 import { Team, Member } from './team.models';
 

src/tsconfig.spec.json

@@ -11,7 +11,8 @@
     ]
   },
   "files": [
-    "test.ts"
+    "test.ts",
+    "polyfills.ts"
   ],
   "include": [
     "**/*.spec.ts",

tslint.json

@@ -14,8 +14,7 @@
     "eofline": true,
     "forin": true,
     "import-blacklist": [
-      true,
-      "rxjs"
+      true
     ],
     "import-spacing": true,
     "indent": [