refactor: Migrated the project to standalone -- step 3

prong generate @angular/core:standalone
? Choose the type of migration: Bootstrap the application using standalone APIs
? Which path in your project should be migrated? ./

diff --git a/src/app/app.component.spec.ts b/src/app/app.component.spec.ts
index 97e5fe9e617d1ef010478a4a47c2a04e2538c706..de0b395e3e93bd00ada040c0afc8f2b0b1be5a1e 100644 (file)
--- a/src/app/app.component.spec.ts
+++ b/src/app/app.component.spec.ts
@@ -6,9 +6,7 @@ describe('AppComponent', () => {
   beforeEach(async () => {
     await TestBed.configureTestingModule({
       imports: [
-        RouterTestingModule
-      ],
-      declarations: [
+        RouterTestingModule,
         AppComponent
       ],
     }).compileComponents();

diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 9a05a567fb1cc9c14339195eda17100ee08a82d2..b8ce60188b9f3de3871e54cb48963dbeae241ae4 100644 (file)
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,9 +1,12 @@
 import { Component } from '@angular/core';
+import { RouterOutlet } from '@angular/router';
 
 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
-  styleUrls: ['./app.component.less']
+  styleUrls: ['./app.component.less'],
+  standalone: true,
+  imports: [RouterOutlet],
 })
 export class AppComponent {
   title = 'chatroom-frontend';

diff --git a/src/app/app.module.ts b/src/app/app.module.ts
deleted file mode 100644 (file)
index 22f37b8..0000000
--- a/src/app/app.module.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import { NgModule } from '@angular/core';
-import { BrowserModule } from '@angular/platform-browser';
-import { ReactiveFormsModule } from "@angular/forms";
-import { HttpClientModule } from '@angular/common/http';
-
-import { AppRoutingModule } from './app-routing.module';
-import { AppComponent } from './app.component';
-import { ChatroomsComponent } from './chatrooms/chatrooms.component';
-import { UserComponent } from './user/user.component';
-import { ChatroomComponent } from './chatroom/chatroom.component';
-
-@NgModule({
-  declarations: [
-    AppComponent
-  ],
-  imports: [
-    BrowserModule,
-    ReactiveFormsModule,
-    HttpClientModule,
-    AppRoutingModule,
-    ChatroomsComponent,
-    UserComponent,
-    ChatroomComponent
-  ],
-  providers: [],
-  bootstrap: [AppComponent],
-})
-export class AppModule { }

diff --git a/src/main.ts b/src/main.ts
index c58dc05cbc6d094a9ed44203c6b69b74e5294452..2ea3c5fa9921ef0c47d128638871610d030263b3 100644 (file)
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,7 +1,23 @@
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 
-import { AppModule } from './app/app.module';
 
+import { importProvidersFrom } from '@angular/core';
+import { AppComponent } from './app/app.component';
+import { AppRoutingModule } from './app/app-routing.module';
+import { withInterceptorsFromDi, provideHttpClient } from '@angular/common/http';
+import { ReactiveFormsModule } from '@angular/forms';
+import { BrowserModule, bootstrapApplication } from '@angular/platform-browser';
 
-platformBrowserDynamic().bootstrapModule(AppModule)
+
+bootstrapApplication(AppComponent, {
+  providers: [
+    importProvidersFrom(
+      BrowserModule,
+      ReactiveFormsModule,
+      AppRoutingModule,
+    ),
+    provideHttpClient(
+      withInterceptorsFromDi(),
+    )
+  ]})
   .catch(err => console.error(err));