Angular的啓動過程

      咱們知道由命令 ng new project-name，cli將會建立一個基礎的angular應用，咱們是能夠直接運行起來一個應用。這歸功與cli已經給咱們建立好了一個根模塊AppModule，而根模塊就是用來啓動此應用的模塊。

     main.ts 是啓動的起點，platformBrowserDynamic這個函數是瀏覽器平臺的工廠函數,執行會返回瀏覽器平臺的實例，而後對根模塊進行初始化，鏈式的將全部的依賴的Module都給加載進來。每一個應用程序都是經過模塊的using bootstrapModule方法建立的。

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

if (environment.production) {
  enableProdMode();
}

// 首先建立平臺，而後建立應用程序實例。
platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.error(err));

 

      建立應用程序時，Angular會檢查根模塊AppModule，AppModule的屬性bootstrap用於引導應用程序。此屬性一般來來引導應用程序的組件。而後Angular在DOM中找到做爲自舉組件的選擇器的元素，並初始化該組件。大概就這樣吧。

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

此隨筆乃本人學習工做記錄，若有疑問歡迎在下面評論，轉載請標明出處。

若是對您有幫助請動動鼠標右下方給我來個贊，您的支持是我最大的動力。