build: upgrade to Angular and CDK v9 (#1143)

package.json

@@ -24,32 +24,33 @@
     "lib:test": "gulp test",
     "lib:test:ssr": "gulp test:ssr",
     "universal:build": "gulp ci:prerender",
-    "universal:serve": "gulp universal:serve"
+    "universal:serve": "gulp universal:serve",
+    "postinstall": "ngcc --properties es2015 browser module main --create-ivy-entry-points"
   },
   "version": "8.0.0-beta.27",
-  "requiredAngularVersion": ">=8.0.0-rc.5",
+  "requiredAngularVersion": ">=9.0.0-rc.6",
   "dependencies": {
-    "@angular/cdk": "^8.0.0-rc.1",
-    "@angular/common": "^8.0.0-rc.5",
-    "@angular/compiler": "^8.0.0-rc.5",
-    "@angular/core": "^8.0.0-rc.5",
-    "@angular/platform-browser": "^8.0.0-rc.5",
+    "@angular/cdk": "^9.0.0-rc.5",
+    "@angular/common": "^9.0.0-rc.6",
+    "@angular/compiler": "^9.0.0-rc.6",
+    "@angular/core": "^9.0.0-rc.6",
+    "@angular/platform-browser": "^9.0.0-rc.6",
     "core-js": "^2.5.7",
     "karma-parallel": "^0.3.1",
     "rxjs": "^6.5.1",
     "systemjs": "0.19.43",
-    "tsickle": "^0.35.0",
+    "tsickle": "^0.37.1",
     "tslib": "^1.9.3",
-    "zone.js": "~0.9.1"
+    "zone.js": "~0.10.2"
   },
   "devDependencies": {
-    "@angular/animations": "^8.0.0-rc.5",
-    "@angular/compiler-cli": "^8.0.0-rc.5",
-    "@angular/forms": "^8.0.0-rc.5",
-    "@angular/material": "^8.0.0-rc.1",
-    "@angular/platform-browser-dynamic": "^8.0.0-rc.5",
-    "@angular/platform-server": "^8.0.0-rc.5",
-    "@angular/router": "^8.0.0-rc.5",
+    "@angular/animations": "^9.0.0-rc.6",
+    "@angular/compiler-cli": "^9.0.0-rc.6",
+    "@angular/forms": "^9.0.0-rc.6",
+    "@angular/material": "^9.0.0-rc.5",
+    "@angular/platform-browser-dynamic": "^9.0.0-rc.6",
+    "@angular/platform-server": "^9.0.0-rc.6",
+    "@angular/router": "^9.0.0-rc.6",
     "@firebase/app-types": "^0.3.2",
     "@types/chalk": "^0.4.31",
     "@types/fs-extra": "^4.0.5",
@@ -59,7 +60,7 @@
     "@types/jasmine": "^2.8.11",
     "@types/merge2": "^0.3.30",
     "@types/minimist": "^1.2.0",
-    "@types/node": "^7.10.1",
+    "@types/node": "^12.12.17",
     "@types/run-sequence": "^0.0.29",
     "@types/rx": "2.5.33",
     "axe-webdriverjs": "^1.1.5",
@@ -119,10 +120,10 @@
     "ts-node": "^3.0.4",
     "tsconfig-paths": "^2.3.0",
     "tslint": "^5.11.0",
-    "typescript": "~3.4.5",
+    "typescript": "~3.6.4",
     "uglify-js": "^2.8.14"
   },
-  "// Gulp": "Overwrite graceful-fs to a version that does not rely on the 'natives' package. This fixes gulp for >= 10.13, more information: #28213",
+  "// Gulp": "Overwrite graceful-fs to a version that does not rely on the 'natives' package. This fixes gulp for >= 10.13, more information: angular/angular#28213",
   "resolutions": {
     "**/graceful-fs": "4.2.2"
   }

src/apps/demo-app/angular.json

@@ -11,10 +11,11 @@
         "build": {
           "builder": "@angular-devkit/build-angular:browser",
           "options": {
+            "aot": true,
             "outputPath": "dist/browser",
             "index": "src/index.html",
             "main": "src/main.ts",
-            "tsConfig": "src/tsconfig.app.json",
+            "tsConfig": "tsconfig.app.json",
             "polyfills": "src/polyfills.ts",
             "assets": [
               "src/assets",
@@ -27,6 +28,12 @@
           },
           "configurations": {
             "production": {
+              "budgets": [
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "6kb"
+                }
+              ],
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
@@ -68,7 +75,7 @@
             "main": "src/test.ts",
             "karmaConfig": "./karma.conf.js",
             "polyfills": "src/polyfills.ts",
-            "tsConfig": "src/tsconfig.spec.json",
+            "tsConfig": "tsconfig.spec.json",
             "scripts": [],
             "styles": [
               "src/styles.scss"
@@ -83,8 +90,8 @@
           "builder": "@angular-devkit/build-angular:tslint",
           "options": {
             "tsConfig": [
-              "src/tsconfig.app.json",
-              "src/tsconfig.spec.json"
+              "tsconfig.app.json",
+              "tsconfig.spec.json"
             ],
             "exclude": [
               "**/node_modules/**"
@@ -96,7 +103,7 @@
           "options": {
             "outputPath": "dist/server",
             "main": "src/main.server.ts",
-            "tsConfig": "src/tsconfig.server.json"
+            "tsConfig": "tsconfig.server.json"
           }
         }
       }
@@ -137,4 +144,4 @@
       "prefix": "demo"
     }
   }
-}
+}

src/apps/demo-app/package.json

@@ -14,7 +14,6 @@
   "dependencies": {
     "@angular/animations": "file:../../../node_modules/@angular/animations",
     "@angular/cdk": "file:../../../node_modules/@angular/cdk",
-    "@angular/cli": "^8.3.17",
     "@angular/common": "file:../../../node_modules/@angular/common",
     "@angular/compiler": "file:../../../node_modules/@angular/compiler",
     "@angular/core": "file:../../../node_modules/@angular/core",
@@ -27,16 +26,18 @@
     "@angular/router": "file:../../../node_modules/@angular/router",
     "core-js": "file:../../../node_modules/core-js",
     "rxjs": "file:../../../node_modules/rxjs",
+    "tslib": "file:../../../node_modules/tslib",
     "zone.js": "file:../../../node_modules/zone.js"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~0.803.17",
+    "@angular-devkit/build-angular": "~0.900.0-rc.2",
+    "@angular/cli": "^9.0.0-rc.2",
     "@angular/compiler-cli": "file:../../../node_modules/@angular/compiler-cli",
-    "@angular/language-service": "^8.2.13",
+    "@angular/language-service": "^9.0.0-rc.2",
     "@types/jasmine": "~2.8.3",
     "@types/jasminewd2": "~2.0.2",
-    "@types/node": "~6.0.60",
-    "codelyzer": "^5.0.1",
+    "@types/node": "^12.12.11",
+    "codelyzer": "^5.1.2",
     "jasmine-core": "~2.8.0",
     "jasmine-spec-reporter": "~4.2.1",
     "karma": "~2.0.0",

src/apps/demo-app/src/app/routing.module.ts

@@ -4,13 +4,24 @@ import {HashLocationStrategy, LocationStrategy} from '@angular/common';
 
 const DEMO_APP_ROUTES: Routes = [
   {path: '', redirectTo: 'docs', pathMatch: 'full'},
-  {path: 'grid', loadChildren: './grid/grid.module#DocsGridModule'},
-  {path: 'docs', loadChildren: './layout/layout.module#DocsLayoutModule'},
-  {path: 'responsive', loadChildren: './responsive/responsive.module#DocsResponsiveModule'},
-  {path: 'issues', loadChildren: './github-issues/github-issues.module#DocsGithubIssuesModule'},
+  {path: 'grid', loadChildren: () => import('./grid/grid.module').then(m => m.DocsGridModule)},
+  {
+    path: 'docs', loadChildren: () => import('./layout/layout.module')
+      .then(m => m.DocsLayoutModule)
+  },
+  {
+    path: 'responsive',
+    loadChildren: () => import('./responsive/responsive.module').then(m => m.DocsResponsiveModule)
+  },
+  {
+    path: 'issues',
+    loadChildren: () => import('./github-issues/github-issues.module')
+      .then(m => m.DocsGithubIssuesModule)
+  },
   {
     path: 'stackoverflow',
-    loadChildren: './stack-overflow/stack-overflow.module#DocsStackOverflowModule'
+    loadChildren: () => import('./stack-overflow/stack-overflow.module')
+      .then(m => m.DocsStackOverflowModule)
   }
 ];
 

src/apps/demo-app/src/main.server.ts

@@ -7,3 +7,5 @@ if (environment.production) {
 }
 
 export { AppServerModule } from './app/app.server.module';
+
+export { renderModule, renderModuleFactory } from '@angular/platform-server';

src/apps/demo-app/tsconfig.app.json

@@ -0,0 +1,14 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./out-tsc/app",
+    "types": []
+  },
+  "files": [
+    "src/main.ts",
+    "src/polyfills.ts"
+  ],
+  "include": [
+    "src/**/*.d.ts"
+  ]
+}

src/apps/demo-app/tsconfig.json

@@ -16,7 +16,7 @@
       "es2017",
       "dom"
     ],
-    "module": "es2015",
+    "module": "esnext",
     "baseUrl": "./"
   }
 }

src/apps/demo-app/tsconfig.server.json

@@ -0,0 +1,17 @@
+{
+  "extends": "./tsconfig.app.json",
+  "compilerOptions": {
+    "outDir": "./out-tsc/app-server",
+    "module": "commonjs",
+    "types": [
+      "node"
+    ]
+  },
+  "files": [
+    "src/main.server.ts",
+    "server.ts"
+  ],
+  "angularCompilerOptions": {
+    "entryModule": "./src/app/app.server.module#AppServerModule"
+  }
+}

src/apps/demo-app/src/tsconfig.spec.json → src/apps/demo-app/tsconfig.spec.json

@@ -1,16 +1,15 @@
 {
-  "extends": "../tsconfig.json",
+  "extends": "./tsconfig.json",
   "compilerOptions": {
     "outDir": "../out-tsc/spec",
     "baseUrl": "./",
-    "module": "commonjs",
     "types": [
       "jasmine",
       "node"
     ]
   },
   "files": [
-    "test.ts",
+    "src/test.ts",
     "polyfills.ts"
   ],
   "include": [

src/apps/hello-world/angular.json

@@ -11,6 +11,7 @@
         "build": {
           "builder": "@angular-devkit/build-angular:browser",
           "options": {
+            "aot": true,
             "outputPath": "dist",
             "index": "src/index.html",
             "main": "src/main.ts",
@@ -27,6 +28,12 @@
           },
           "configurations": {
             "production": {
+              "budgets": [
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "6kb"
+                }
+              ],
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
@@ -88,4 +95,4 @@
       "spec": false
     }
   }
-}
+}

src/apps/hello-world/package.json

@@ -11,24 +11,24 @@
   "dependencies": {
     "@angular/animations": "file:../../../node_modules/@angular/animations",
     "@angular/cdk": "file:../../../node_modules/@angular/cdk",
-    "@angular/cli": "^8.3.17",
     "@angular/common": "file:../../../node_modules/@angular/common",
     "@angular/compiler": "file:../../../node_modules/@angular/compiler",
     "@angular/core": "file:../../../node_modules/@angular/core",
     "@angular/flex-layout": "file:../../../dist/releases/flex-layout/angular-flex-layout.tgz",
     "@angular/forms": "file:../../../node_modules/@angular/forms",
-    "@angular/material": "file:../../../node_modules/@angular/material",
     "@angular/platform-browser": "file:../../../node_modules/@angular/platform-browser",
     "@angular/platform-browser-dynamic": "file:../../../node_modules/@angular/platform-browser-dynamic",
     "@angular/router": "file:../../../node_modules/@angular/router",
     "core-js": "file:../../../node_modules/core-js",
     "rxjs": "file:../../../node_modules/rxjs",
+    "tslib": "file:../../../node_modules/tslib",
     "zone.js": "file:../../../node_modules/zone.js"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~0.803.17",
+    "@angular-devkit/build-angular": "~0.900.0-rc.2",
+    "@angular/cli": "^9.0.0-rc.2",
     "@angular/compiler-cli": "file:../../../node_modules/@angular/compiler-cli",
-    "@angular/language-service": "^8.2.13",
+    "@angular/language-service": "^9.0.0-rc.2",
     "typescript": "file:../../../node_modules/typescript"
   }
 }

src/apps/hello-world/src/tsconfig.app.json

@@ -6,8 +6,8 @@
     "module": "es2015",
     "types": []
   },
-  "exclude": [
-    "test.ts",
-    "**/*.spec.ts"
+  "files": [
+    "main.ts",
+    "polyfills.ts"
   ]
 }

src/apps/hello-world/tsconfig.json

@@ -15,7 +15,7 @@
       "es2017",
       "dom"
     ],
-    "module": "es2015",
+    "module": "esnext",
     "baseUrl": "./"
   }
-}
+}