Migrate to Angular 10

Author: AlehKatsiubaFormIO

angular.json

@@ -10,7 +10,7 @@
       "prefix": "app",
       "schematics": {
         "@schematics/angular:component": {
-          "styleext": "scss"
+          "style": "scss"
         }
       },
       "architect": {

package-lock.json

@@ -12,46 +12,47 @@
     "deploy": "npm run builddemo; cd dist/demo; git init; git remote add origin [email protected]:formio/angular-demo.git; git checkout -b gh-pages; git add -A; git commit -m 'Update demo application'; git push -f origin gh-pages;"
   },
   "dependencies": {
-    "@angular/animations": "^9.1.11",
-    "@angular/common": "^9.1.11",
-    "@angular/compiler": "^9.1.11",
-    "@angular/core": "^9.1.11",
-    "@angular/elements": "^9.1.11",
-    "@angular/forms": "^9.1.11",
-    "@angular/platform-browser": "^9.1.11",
-    "@angular/platform-browser-dynamic": "^9.1.11",
-    "@angular/router": "^9.1.11",
+    "@angular/animations": "^10.2.1",
+    "@angular/common": "^10.2.1",
+    "@angular/compiler": "^10.2.1",
+    "@angular/core": "^10.2.1",
+    "@angular/elements": "^10.2.1",
+    "@angular/forms": "^10.2.1",
+    "@angular/platform-browser": "^10.2.1",
+    "@angular/platform-browser-dynamic": "^10.2.1",
+    "@angular/router": "^10.2.1",
     "angular-formio": "^4.8.0",
     "bootstrap": "^4.5.0",
     "bootswatch": "^4.5.0",
     "core-js": "^3.6.5",
     "font-awesome": "^4.7.0",
     "formiojs": "^4.10.0",
     "jquery": "^3.5.1",
+    "ngx-bootstrap": "^6.1.0",
     "prism-themes": "^1.4.0",
     "prismjs": "^1.20.0",
     "rxjs": "^6.5.5",
     "zone.js": "^0.10.3"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^0.901.8",
-    "@angular/cli": "^9.1.8",
-    "@angular/compiler-cli": "^9.1.11",
-    "@angular/language-service": "^9.1.11",
+    "@angular-devkit/build-angular": "^0.1002.0",
+    "@angular/cli": "^10.2.0",
+    "@angular/compiler-cli": "^10.2.1",
+    "@angular/language-service": "^10.2.1",
     "@types/jasmine": "^3.5.10",
     "@types/jasminewd2": "^2.0.8",
     "@types/node": "^14.0.13",
     "codelyzer": "^5.2.2",
-    "jasmine-core": "^3.5.0",
-    "jasmine-spec-reporter": "^5.0.2",
-    "karma": "^5.0.9",
-    "karma-chrome-launcher": "^3.1.0",
-    "karma-coverage-istanbul-reporter": "^3.0.3",
-    "karma-jasmine": "^3.3.1",
-    "karma-jasmine-html-reporter": "^1.5.4",
-    "protractor": "^7.0.0",
+    "jasmine-core": "~3.5.0",
+    "jasmine-spec-reporter": "~5.0.0",
+    "karma": "~5.0.0",
+    "karma-chrome-launcher": "~3.1.0",
+    "karma-coverage-istanbul-reporter": "~3.0.2",
+    "karma-jasmine": "~4.0.0",
+    "karma-jasmine-html-reporter": "^1.5.0",
+    "protractor": "~7.0.0",
     "ts-node": "^8.10.2",
-    "tslint": "^6.1.2",
-    "typescript": "~3.7.4"
+    "tslint": "~6.1.0",
+    "typescript": "~4.0.5"
   }
 }

package.json

@@ -45,19 +45,19 @@ import { DataComponent } from './data/data.component';
       },
       {
         path: 'forms',
-        loadChildren: './forms/forms.module#FormsModule'
+        loadChildren: () => import('./forms/forms.module').then(m => m.FormsModule)
       },
       {
         path: 'auth',
-        loadChildren: './auth/auth.module#AuthModule'
+        loadChildren: () => import('./auth/auth.module').then(m => m.AuthModule)
       },
       {
         path: 'event',
-        loadChildren: './event/event.module#EventModule'
+        loadChildren: () => import('./event/event.module').then(m => m.EventModule)
       },
       {
         path: 'manager',
-        loadChildren: './form/form.module#FormModule'
+        loadChildren: () => import('./form/form.module').then(m => m.FormModule)
       }
     ], {useHash: true})
   ],

src/browserslist src/.browserslistrc

@@ -1,5 +1,5 @@
 @import "~bootswatch/dist/cosmo/_variables.scss";
 @import "~bootstrap/scss/bootstrap.scss";
 @import "~bootswatch/dist/cosmo/_bootswatch.scss";
-$fa-font-path: '../node_modules/font-awesome/fonts';
+$fa-font-path: '~font-awesome/fonts';
 @import '~font-awesome/scss/font-awesome';

src/app/app.module.ts

@@ -5,7 +5,7 @@
     "outDir": "./dist/out-tsc",
     "sourceMap": true,
     "declaration": false,
-    "module": "es2015",
+    "module": "es2020",
     "moduleResolution": "node",
     "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
@@ -17,8 +17,5 @@
       "es2017",
       "dom"
     ]
-  },
-  "angularCompilerOptions": {
-    "enableIvy": false
   }
 }

src/styles.scss

@@ -72,7 +72,6 @@
     "no-trailing-whitespace": true,
     "no-unnecessary-initializer": true,
     "no-unused-expression": true,
-    "no-use-before-declare": true,
     "no-var-keyword": true,
     "object-literal-sort-keys": false,
     "one-line": [