bootstrapApplication is the modern Angular entry point for creating an application from one root component and optional application configuration. It replaces platformBrowserDynamic().bootstrapModule(AppModule), allowing standalone applications to initialize without an NgModule. section 1.3.3
The application configuration carries dependency-injection providers through ApplicationConfig. Routing moves from RouterModule.forRoot(routes) to provideRouter(routes), while main.ts directly bootstraps AppComponent. section 1.3.3
Standalone HRMS entry point
A generated HRMS project can keep configuration in app/app.config.ts and start from main.ts: import { bootstrapApplication } from '@angular/platform-browser'; import { appConfig } from './app/app.config'; import { AppComponent } from './app/app.component'; bootstrapApplication(AppComponent, appConfig).catch((err) => console.error(err)); The root component is standalone, and appConfig can provide routing with provideRouter(routes). section 1.3.3
Migrate a legacy NgModule application incrementally:
- Run ng g @angular/core:standalone on Angular v16 and choose “Convert all components, directives, and pipes to standalone.” section 2.5.3
- Run the schematic again to remove unnecessary NgModule classes, testing the application after each conversion. section 2.5.3
- Run “Bootstrap the Application Using Standalone APIs” to remove AppModule and switch main.ts to bootstrapApplication. section 2.5.3
- Inspect remaining NgModules, standalone routing, and third-party dependencies that may still use importProvidersFrom. section 2.5.3
.
└── hrms/
└── src/
├── app/
│ ├── app.component.css
│ ├── app.component.html
│ ├── app.component.spec.ts
│ ├── app.component.ts
│ ├── app.config.ts
│ └── app.routes.ts
├── assets/
├── index.html
├── main.ts
└── styles.css
Browse the standalone project structure locating main.ts, app.config.ts, app.routes.ts, and the root component files. section 1.3.3
