chore: updates angular to v18

angular.json

@@ -11,12 +11,15 @@
             "prefix": "app",
             "architect": {
                 "build": {
-                    "builder": "@angular-devkit/build-angular:browser",
+                    "builder": "@angular-devkit/build-angular:application",
                     "options": {
-                        "outputPath": "dist/frontend-hideyoshi.com",
+                        "outputPath": {
+                          "base": "dist/frontend-hideyoshi.com"
+                        },
                         "index": "src/index.html",
-                        "main": "src/main.ts",
-                        "polyfills": "src/polyfills.ts",
+                        "polyfills": [
+                          "src/polyfills.ts"
+                        ],
                         "tsConfig": "tsconfig.app.json",
                         "allowedCommonJsDependencies": [
                             "ts-interface-checker",
@@ -39,8 +42,8 @@
                             "node_modules/bootstrap/dist/js/bootstrap.bundle.js",
                             "node_modules/cookieconsent/build/cookieconsent.min.js"
                         ],
-                        "serviceWorker": true,
-                        "ngswConfigPath": "ngsw-config.json"
+                        "serviceWorker": "ngsw-config.json",
+                        "browser": "src/main.ts"
                     },
                     "configurations": {
                         "production": {
@@ -66,9 +69,7 @@
                             "serviceWorker": true
                         },
                         "development": {
-                            "buildOptimizer": false,
                           "optimization": false,
-                            "vendorChunk": true,
                             "extractLicenses": false,
                             "sourceMap": true,
                             "namedChunks": true

package.json

@@ -16,17 +16,17 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^17.3.12",
+    "@angular/animations": "^18.2.14",
     "@angular/cdk": "^16.2.1",
-    "@angular/common": "^17.3.12",
-    "@angular/compiler": "^17.3.12",
-    "@angular/core": "^17.3.12",
-    "@angular/forms": "^17.3.12",
+    "@angular/common": "^18.2.14",
+    "@angular/compiler": "^18.2.14",
+    "@angular/core": "^18.2.14",
+    "@angular/forms": "^18.2.14",
     "@angular/material": "^16.2.1",
-    "@angular/platform-browser": "^17.3.12",
-    "@angular/platform-browser-dynamic": "^17.3.12",
-    "@angular/router": "^17.3.12",
-    "@angular/service-worker": "^17.3.12",
+    "@angular/platform-browser": "^18.2.14",
+    "@angular/platform-browser-dynamic": "^18.2.14",
+    "@angular/router": "^18.2.14",
+    "@angular/service-worker": "^18.2.14",
     "@fortawesome/angular-fontawesome": "^0.13.0",
     "@fortawesome/fontawesome-svg-core": "^6.1.1",
     "@fortawesome/free-brands-svg-icons": "^6.1.1",
@@ -52,14 +52,14 @@
     "zone.js": "~0.14.10"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^17.3.17",
+    "@angular-devkit/build-angular": "^18.2.21",
     "@angular-eslint/builder": "^16.1.1",
     "@angular-eslint/eslint-plugin": "16.1.1",
     "@angular-eslint/eslint-plugin-template": "16.1.1",
     "@angular-eslint/schematics": "^20.5.0",
     "@angular-eslint/template-parser": "16.1.1",
-    "@angular/cli": "^17.3.17",
-    "@angular/compiler-cli": "^17.3.12",
+    "@angular/cli": "^18.2.21",
+    "@angular/compiler-cli": "^18.2.14",
     "@types/jasmine": "~4.0.0",
     "@types/node": "^18.11.19",
     "@typescript-eslint/eslint-plugin": "^5.59.2",

src/app/shared/shared.module.ts

@@ -3,24 +3,18 @@ import {CommonModule} from '@angular/common';
 import {ClickedOutsideDirective} from './directive/clicked-outside/clicked-outside.directive';
 import {SliderItemComponent} from './components/slider-item/slider-item.component';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
-import {HttpClientModule} from '@angular/common/http';
+import { provideHttpClient, withInterceptorsFromDi } from '@angular/common/http';
 import {PopupComponent} from './components/popup/popup.component';
 import {FontAwesomeModule} from '@fortawesome/angular-fontawesome';
 import {CookieConsentModule} from './cookie-consent/cookie-consent.module';
 
-@NgModule({
-    declarations: [
+@NgModule({ declarations: [
         ClickedOutsideDirective,
         SliderItemComponent,
         PopupComponent,
     ],
-    imports: [
-        CommonModule,
-        HttpClientModule,
+    exports: [ClickedOutsideDirective, SliderItemComponent, PopupComponent], imports: [CommonModule,
         BrowserAnimationsModule,
         FontAwesomeModule,
-        CookieConsentModule,
-    ],
-    exports: [ClickedOutsideDirective, SliderItemComponent, PopupComponent],
-})
+        CookieConsentModule], providers: [provideHttpClient(withInterceptorsFromDi())] })
 export class SharedModule {}

tsconfig.json

@@ -5,6 +5,7 @@
         "baseUrl": "./",
         "outDir": "./dist/out-tsc",
         "forceConsistentCasingInFileNames": true,
+        "esModuleInterop": true,
         "strict": true,
         "noImplicitOverride": true,
         "noPropertyAccessFromIndexSignature": true,
@@ -12,7 +13,6 @@
         "noFallthroughCasesInSwitch": true,
         "sourceMap": true,
         "declaration": false,
-        "downlevelIteration": true,
         "experimentalDecorators": true,
         "moduleResolution": "node",
         "importHelpers": true,