upgraded to latest version of angular and material (17.2)

- Migrated to new control flow syntax - https://blog.angular.io/introducing-angular-v17-4d7033312e4b - ng generate @angular/core:control-flow - Migrated to standalone components - https://angular.io/guide/standalone-migration - ng generate @angular/core:standalone - Removed deprecated flex-layout package - Replaced with bootstrap flex utilities - Migrated to material mdc components - https://material.angular.io/guide/mdc-migration - ng generate @angular/material:mdc-migration - Switched to new esbuild application builder over webpack - https://angular.io/guide/esbuild - ng update @angular/cli --name use-application-builder - Updated all packages - Cleaned up uneccessary files and applied best practices where applicable - Migrated to lazy-loaded routing - Applied prettier to all files - Updated .prettierc for angular control flow
cmu-sei · Feb 16, 2024 · 5042a72 · 5042a72
1 parent 6be409b
commit 5042a72
Show file tree

Hide file tree

Showing 79 changed files with 24,789 additions and 18,291 deletions.
diff --git a/.browserslistrc b/.browserslistrc
diff --git a/.prettierrc b/.prettierrc
@@ -1,2 +1,6 @@
 tabWidth: 2
 singleQuote: true
+overrides:
+  - files: '*.html'
+    options:
+      parser: 'angular'
diff --git a/Dockerfile b/Dockerfile
@@ -14,7 +14,7 @@ WORKDIR /ng-app
 
 COPY . .
 
-RUN $(npm bin)/ng build --resources-output-path=assets/fonts --aot --configuration production 
+RUN $(npm bin)/ng build --resources-output-path=assets/fonts --configuration production 
 
 ### Stage 2: Setup ###
 

diff --git a/angular.json b/angular.json
@@ -3,20 +3,22 @@
   "version": 1,
   "newProjectRoot": "projects",
   "projects": {
-    "player.vm.console.ui": {
+    "player-vm-console-ui": {
       "root": "",
       "sourceRoot": "src",
       "projectType": "application",
       "architect": {
         "build": {
-          "builder": "@angular-devkit/build-angular:browser",
+          "builder": "@angular-devkit/build-angular:application",
           "options": {
             "preserveSymlinks": true,
-            "outputPath": "dist",
+            "outputPath": {
+              "base": "dist",
+              "browser": ""
+            },
             "index": "src/index.html",
-            "main": "src/main.ts",
             "tsConfig": "src/tsconfig.app.json",
-            "polyfills": "src/polyfills.ts",
+            "polyfills": ["zone.js"],
             "assets": [
               "src/assets",
               {
@@ -25,74 +27,90 @@
                 "output": "/"
               }
             ],
-            "styles": ["src/styles/styles.scss"],
+            "styles": [
+              "src/styles/styles.scss",
+              "./node_modules/bootstrap/scss/bootstrap-utilities.scss"
+            ],
+            "stylePreprocessorOptions": {
+              "includePaths": [
+                "src/styles",
+                "./node_modules/bootstrap/scss/bootstrap-utilities.scss"
+              ]
+            },
             "scripts": [
               "node_modules/jquery/dist/jquery.js",
               "node_modules/jquery-ui-dist/jquery-ui.js",
               "src/assets/vmware-wmks/js/wmks.min.js"
             ],
-            "vendorChunk": true,
-            "extractLicenses": false,
-            "buildOptimizer": false,
-            "sourceMap": true,
-            "optimization": false,
-            "namedChunks": true
+            "browser": "src/main.ts"
           },
           "configurations": {
             "production": {
-              "optimization": true,
-              "outputHashing": "all",
-              "sourceMap": false,
-              "namedChunks": false,
-              "extractLicenses": true,
-              "vendorChunk": false,
-              "buildOptimizer": true,
-              "fileReplacements": [
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "1mb",
+                  "maximumError": "2mb"
+                },
                 {
-                  "replace": "src/environments/environment.ts",
-                  "with": "src/environments/environment.prod.ts"
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "2kb",
+                  "maximumError": "4kb"
                 }
-              ]
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "optimization": false,
+              "extractLicenses": false,
+              "sourceMap": true
             }
-          }
+          },
+          "defaultConfiguration": "production"
         },
         "serve": {
           "builder": "@angular-devkit/build-angular:dev-server",
           "options": {
-            "browserTarget": "player.vm.console.ui:build",
             "port": 4305
           },
           "configurations": {
             "production": {
-              "browserTarget": "player.vm.console.ui:build:production"
+              "buildTarget": "player-vm-console-ui:build:production"
+            },
+            "development": {
+              "buildTarget": "player-vm-console-ui:build:development"
             }
-          }
+          },
+          "defaultConfiguration": "development"
         },
         "extract-i18n": {
           "builder": "@angular-devkit/build-angular:extract-i18n",
           "options": {
-            "browserTarget": "player.vm.console.ui:build"
+            "buildTarget": "player-vm-console-ui:build"
           }
         },
         "test": {
           "builder": "@angular-devkit/build-angular:karma",
           "options": {
             "main": "src/test.ts",
             "karmaConfig": "./karma.conf.js",
-            "polyfills": "src/polyfills.ts",
+            "polyfills": ["zone.js", "zone.js/testing"],
             "tsConfig": "src/tsconfig.spec.json",
             "scripts": [
               "node_modules/jquery/dist/jquery.js",
               "node_modules/jquery-ui-dist/jquery-ui.js",
               "src/assets/vmware-wmks/js/wmks.min.js"
             ],
-            "styles": ["src/styles.css"],
+            "styles": [
+              "src/styles.css",
+              "./node_modules/bootstrap/scss/bootstrap-utilities.scss"
+            ],
             "assets": ["src/assets", "src/favicon.ico"]
           }
         }
       }
     },
-    "player.vm.console.ui-e2e": {
+    "player-vm-console-ui-e2e": {
       "root": "",
       "sourceRoot": "e2e",
       "projectType": "application",
@@ -101,7 +119,7 @@
           "builder": "@angular-devkit/build-angular:protractor",
           "options": {
             "protractorConfig": "./protractor.conf.js",
-            "devServerTarget": "player.vm.console.ui:serve"
+            "devServerTarget": "player-vm-console-ui:serve"
           }
         }
       }