build: upgraded to angular 12

angular.json

@@ -13,7 +13,6 @@
         "build": {
           "builder": "@angular-devkit/build-angular:browser",
           "options": {
-            "aot": true,
             "outputPath": "dist/ngx-seed-app",
             "index": "src/index.html",
             "main": "src/main.ts",
@@ -30,7 +29,13 @@
               "node_modules/bootstrap/dist/css/bootstrap.css",
               "src/styles.css"
             ],
-            "scripts": []
+            "scripts": [],
+            "vendorChunk": true,
+            "extractLicenses": false,
+            "buildOptimizer": false,
+            "sourceMap": true,
+            "optimization": false,
+            "namedChunks": true
           },
           "configurations": {
             "production": {
@@ -49,9 +54,7 @@
               "optimization": true,
               "outputHashing": "all",
               "sourceMap": false,
-              "extractCss": true,
               "namedChunks": false,
-              "aot": true,
               "extractLicenses": true,
               "vendorChunk": false,
               "buildOptimizer": true,

package.json

@@ -15,28 +15,29 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^9.1.9",
-    "@angular/cdk": "~9.2.4",
-    "@angular/common": "^9.1.9",
-    "@angular/compiler": "^9.1.9",
-    "@angular/core": "^9.1.9",
-    "@angular/forms": "^9.1.9",
-    "@angular/material": "^9.2.4",
-    "@angular/platform-browser": "^9.1.9",
-    "@angular/platform-browser-dynamic": "^9.1.9",
-    "@angular/router": "^9.1.9",
-    "@angular/service-worker": "^9.1.9",
+    "@angular/animations": "^12.0.1",
+    "@angular/cdk": "~12.0.1",
+    "@angular/common": "^12.0.1",
+    "@angular/compiler": "^12.0.1",
+    "@angular/core": "^12.0.1",
+    "@angular/forms": "^12.0.1",
+    "@angular/localize": "^12.0.1",
+    "@angular/material": "^12.0.1",
+    "@angular/platform-browser": "^12.0.1",
+    "@angular/platform-browser-dynamic": "^12.0.1",
+    "@angular/router": "^12.0.1",
+    "@angular/service-worker": "^12.0.1",
     "@iapps/function-analytics": "^1.0.0-beta.21",
-    "@iapps/ngx-dhis2-data-filter": "^1.0.0-beta.18",
-    "@iapps/ngx-dhis2-http-client": "^2.0.8-rc.2",
-    "@iapps/ngx-dhis2-menu": "^1.0.11-beta.8",
-    "@iapps/ngx-dhis2-org-unit-filter": "^1.1.21-rc.6",
-    "@iapps/ngx-dhis2-period-filter": "^2.0.0-beta.4",
-    "@ngrx/effects": "^9.1.2",
-    "@ngrx/entity": "^9.1.2",
-    "@ngrx/router-store": "^9.1.2",
-    "@ngrx/store": "^9.1.2",
-    "@ngrx/store-devtools": "^9.1.2",
+    "@iapps/ngx-dhis2-data-filter": "^1.0.0-beta.21",
+    "@iapps/ngx-dhis2-http-client": "^2.0.8-rc.5",
+    "@iapps/ngx-dhis2-menu": "^1.0.11-beta.9",
+    "@iapps/ngx-dhis2-org-unit-filter": "^1.1.31",
+    "@iapps/ngx-dhis2-period-filter": "^2.0.0-rc.14",
+    "@ngrx/effects": "^12.0.0",
+    "@ngrx/entity": "^12.0.0",
+    "@ngrx/router-store": "^12.0.0",
+    "@ngrx/store": "^12.0.0",
+    "@ngrx/store-devtools": "^12.0.0",
     "@ngx-translate/core": "^12.1.2",
     "@ngx-translate/http-loader": "^4.0.0",
     "bootstrap": "^4.5.0",
@@ -48,34 +49,34 @@
     "ngx-pagination": "^5.0.0",
     "rxjs": "~6.5.5",
     "tslib": "^2.0.0",
-    "zone.js": "~0.10.3"
+    "zone.js": "~0.11.4"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "~0.901.7",
-    "@angular/cli": "^9.1.7",
-    "@angular/compiler-cli": "^9.1.9",
-    "@angular/language-service": "^9.1.9",
+    "@angular-devkit/build-angular": "~12.0.1",
+    "@angular/cli": "^12.0.1",
+    "@angular/compiler-cli": "^12.0.1",
+    "@angular/language-service": "^12.0.1",
     "@compodoc/compodoc": "^1.1.11",
-    "@ngrx/schematics": "^9.1.2",
-    "@types/jasmine": "^3.5.10",
+    "@ngrx/schematics": "^12.0.0",
+    "@types/jasmine": "~3.6.0",
     "@types/jasminewd2": "^2.0.8",
     "@types/node": "^14.0.5",
-    "codelyzer": "^5.2.2",
+    "codelyzer": "^6.0.0",
     "commitizen": "^4.1.2",
     "cz-conventional-changelog": "^3.2.0",
     "husky": "^4.2.5",
-    "jasmine-core": "~3.5.0",
-    "jasmine-spec-reporter": "~5.0.2",
-    "karma": "^5.0.9",
+    "jasmine-core": "~3.6.0",
+    "jasmine-spec-reporter": "~5.0.0",
+    "karma": "~6.3.2",
     "karma-chrome-launcher": "~3.1.0",
     "karma-coverage-istanbul-reporter": "~3.0.2",
-    "karma-jasmine": "~3.2.0",
-    "karma-jasmine-html-reporter": "^1.5.4",
+    "karma-jasmine": "~4.0.0",
+    "karma-jasmine-html-reporter": "^1.5.0",
     "ngrx-store-freeze": "^0.2.4",
-    "protractor": "^7.0.0",
+    "protractor": "~7.0.0",
     "ts-node": "~8.10.1",
-    "tslint": "~6.1.2",
-    "typescript": "^3.8.3"
+    "tslint": "~6.1.0",
+    "typescript": "^4.0.7"
   },
   "config": {
     "commitizen": {

src/app/app.component.spec.ts

@@ -1,12 +1,12 @@
-import { TestBed, async } from '@angular/core/testing';
+import { TestBed, waitForAsync } from '@angular/core/testing';
 import { AppComponent } from './app.component';
 import { RouterTestingModule } from '@angular/router/testing';
 import { NgxDhis2MenuModule } from '@iapps/ngx-dhis2-menu';
 import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
 import { HttpLoaderFactory } from './app.module';
 import { HttpClient } from '@angular/common/http';
 describe('AppComponent', () => {
-  beforeEach(async(() => {
+  beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       imports: [
         NgxDhis2MenuModule,
@@ -22,7 +22,7 @@ describe('AppComponent', () => {
       declarations: [AppComponent]
     }).compileComponents();
   }));
-  it('should create the app', async(() => {
+  it('should create the app', waitForAsync(() => {
     const fixture = TestBed.createComponent(AppComponent);
     const app = fixture.debugElement.componentInstance;
     expect(app).toBeTruthy();

src/app/app.routes.ts

@@ -12,9 +12,10 @@ export const routes: Routes = [
 @NgModule({
   imports: [
     RouterModule.forRoot(routes, {
-      useHash: true,
-      preloadingStrategy: PreloadAllModules
-    })
+    useHash: true,
+    preloadingStrategy: PreloadAllModules,
+    relativeLinkResolution: 'legacy'
+})
   ],
   exports: [RouterModule]
 })

src/app/pages/home/home.module.ts

@@ -7,6 +7,6 @@ import { pages } from './pages';
 
 @NgModule({
   declarations: [...pages],
-  imports: [CommonModule, SharedModule, HomeRoutingModule]
+  imports: [CommonModule, SharedModule, HomeRoutingModule],
 })
 export class HomeModule {}