Skip to main content

Flow

Source: Medium Article

  • Angular.json
angular.json
// build section
"options" : {
    "main" : "src/main.ts"
}
  • Main.ts boostraps AppModule
main.ts
platformBrowserDynamic().bootstrapModule(AppModule)
  • AppModule bootstraps AppComponent
app.module.ts
bootstrap : [AppComponent],
declarations : [{components}],
imports: [{modules}],
providers : [{services}],
  • AppComponent points to AppComponent HTML page
app.component.ts
@Component({
    selector : 'app-root',
    templateUrl : './app.component.html',
    styleUrls : ['./app.component.css']
})

export class AppComponent{
    title = 'app-name'
}
  • index.html
index.html
<body>
    <app-root></app-root>

    <script src="main.js"></script>

    // Script Injection done by compiler
    <script ...></script>
    <script ...></script>
</body>