Merge pull request #6 from secure-web-apps/feature/update-angular

Update Angular, Angular CLI

Author: rufer7

README.md

@@ -30,7 +30,7 @@ This repository hosts the source code for our .NET User Group Switzerland tour.
 
 [ASP.NET Core/Angular](https://github.com/damienbod/bff-aspnetcore-angular)
 
-![BFF production](https://github.com/secure-web-apps/EndToEndSecurityWeb/blob/main/images/bff-arch-production_01.png)
+![BFF production](https://github.com/secure-web-apps/EndToEndSecurityWeb/blob/main/images/bff-arch-production_01.drawio.png)
 
 ## Agenda
 
@@ -58,16 +58,19 @@ This repository hosts the source code for our .NET User Group Switzerland tour.
   - authorization
   - data requirements
 
-## Angular nx Updates
+## Angular CLI Updates
 
 ```cmd
-nx migrate latest
+npm install -g @angular/cli latest
 
-nx migrate --run-migrations=migrations.json
+ng update
+
+ng update @angular/cli @angular/core
 ```
 
 ## History
 
+- 2025-10-31 Updated to Angular CLI and Angular 20.3.0, using vite in dev
 - 2025-10-31 Updated packages, added terraform, sonar SCA, SAST, improve pipelines
 - 2025-08-30 Updated packages, Angular 20
 - 2025-01-01 .NET 9, Angular 19

images/bff-arch-cache_02.drawio.png

@@ -29,12 +29,8 @@
     if (hostEnvironment.IsDevelopment())
     {
         // do nothing in development, Angular > 18.1.0 adds the nonce automatically
-    }
-    else
-    {
-        // Angular release build does not add any nonce to the scripts, so we need to add it manually
-        var nonceScript = $"<script nonce=\"{nonce}\" ";
-        source = source.Replace("<script ", nonceScript);
+        var viteScriptToUpdate = """<script type="module" src="/@vite/client"></script>""";
+        source = source.Replace(viteScriptToUpdate, $"""<script type="module" src="/@vite/client" nonce="{nonce}"></script>""");
     }
 
     // link rel="stylesheet"

images/bff-arch-cache_02.png

@@ -1,5 +1,4 @@
 {
-  "DetailedErrors": true,
   "Logging": {
     "LogLevel": {
       "Default": "Information",
@@ -16,6 +15,36 @@
           "Path": "assets/{**catch-all}"
         }
       },
+      "angularfsdev": {
+        "ClusterId": "cluster1",
+        "Match": {
+          "Path": "@fs/{**catch-all}"
+        }
+      },
+      "angularngdev": {
+        "ClusterId": "cluster1",
+        "Match": {
+          "Path": "@ng/{**catch-all}"
+        }
+      },
+      "vitedev": {
+        "ClusterId": "cluster1",
+        "Match": {
+          "Path": "@vite/{**catch-all}"
+        }
+      },
+      "wssvite": {
+        "ClusterId": "cluster1",
+        "Match": {
+          "Path": "/",
+          "QueryParameters": [
+            {
+              "Name": "token",
+              "Mode": "Exists"
+            }
+          ]
+        }
+      },
       "routealljs": {
         "ClusterId": "cluster1",
         "Match": {
@@ -34,12 +63,6 @@
           "Path": "/src_{nomatterwhat}_ts.js"
         }
       },
-      "signalr": {
-        "ClusterId": "cluster1",
-        "Match": {
-          "Path": "/ng-cli-ws"
-        }
-      },
       "webpacknodesrcmap": {
         "ClusterId": "cluster1",
         "Match": {

images/bff-arch-development_01.drawio.png

@@ -0,0 +1,17 @@
+# Editor configuration, see https://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.ts]
+quote_type = single
+ij_typescript_use_double_quotes = false
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false