Angular 8.0.0版本正式發佈了!8.0是重大版本升級,整個平臺,包括框架、Angular Material和CLI都同步升級到了新版。Angular 8.0版縮短了應用在現代瀏覽器上的啓動時間,提供了用於訪問CLI的新API,並使Angular支持更多Web標準,追上了Web生態的前沿發展趨勢。
如何更新到Angular 8.0.0版本
用戶可以訪問update.angular.io以獲取新版詳細信息和升級指導,大多數開發者可以使用以下命令開始更新:
ng update @angular/cli @angular/core
默認進行差異加載
差異加載是瀏覽器根據自己的能力來選擇加載新式或舊式JavaScript的過程。現在我們默認開啓此功能,爲應用提供新版構建(es2015)和老式構建(es5)。這樣當用戶加載應用時將自動獲得所需的包。
如果你使用的是ng update,Angular會更新你的tsconfig.json以加入此功能。Angular的CLI會查看tsconfig.json中的target JS級別,以判斷是否啓用差異加載功能。
{
"compilerOptions": {
…
"module": "esnext",
"moduleResolution": "node",
…
"target": "es2015",
…
},
當target設置爲es2015時,Angular會生成並標記兩個包。
運行時,瀏覽器使用腳本標記上的屬性來加載正確的包。
<script type =“module”src =“...”> //新版JS
<script nomodule src =“...”> //老式JS
在angular.io上,爲現代瀏覽器節省了超過40kB的初始包大小。根據社區反饋,應用程序通常可以節省7-20%的捆綁包大小,具體取決於用戶使用了多少新版JavaScript功能。
angular.io上的包大小縮小了大約41KB
在此處查閱有關差異加載的詳細信息。
路徑配置使用動態導入
我們強烈建議用戶使用路由懶加載應用的一些部分。可以在路由配置中使用loadChildren鍵啓用此功能。
舊版是這樣的:
{path: '/admin', loadChildren: './admin/admin.module#AdminModule'}
這種語法是爲Angular定製的,並內置到了我們的工具鏈中。在新版8.0中我們換成了符合行業標準的動態導入。
新版變成了:
{path: `/admin`, loadChildren: () => import(`./admin/admin.module`).then(m => m.AdminModule)}
這將改善VSCode和WebStorm等編輯器對Angular的支持能力,現在它們就能正確理解併爲用戶驗證這些導入了。
如果你使用的是ng update,Angular將自動更新代碼以應用新方式。
CLI中的構建器API
就像Schematics能讓你輸入ng new、ng generate、ng add和ng update一樣,我們發佈的新版構建器API能讓你輸入ng build、ng test和ng run來執行構建和部署等任務。
我們也在與雲服務商合作以利用這些API。現在你可以試一下最新版本的AngularFire,它增加了一個deploy命令,讓構建和部署到Firebase的工作變得非常簡單:
ng add @angular/fire
ng run my-app:deploy
安裝AngularFire後,這個部署命令將以AngularFire建議的方式構建和部署你的應用程序。
CLI中的Workspace API
以前,使用Schematics的開發者必須手動打開並修改angular.json來更改workspace配置。在8.0版本中我們引入了一個新的API,使開發者能更容易地讀取和修改這個文件。
在此查閱有關可用的Workspace API 更多信息
支持Web Worker
如果你需要運行一些CPU密集任務,使用Web Workers就能很好地加快應用的運行速度。使用Web Workers可以將諸如圖像或視頻操作之類的任務掛載到後臺線程。我們在angular.io上使用Web Workers進行應用內搜索索引。
你現在可以從CLI生成新的Web Workers,要將新生成的worker添加到項目中,只需運行:
ng generate webWorker my-worker
添加了Web Workers後就可以在應用程序中正常使用了,CLI能正確地綁定並拆分它的代碼:
const worker = new Worker(`./my-worker.worker`, { type: `module` });
可在此查閱關於Angular CLI中Web Workers的更多信息
AngularJS遷移改進
如果你在AngularJS應用中使用$location服務,Angular現在有了一個LocationUpgradeModule提供統一的位置服務,將定位任務從AngularJS $location服務遷移到了Angular Location服務上。這會改善使用ngUpgrade,需要在AngularJS和Angular部分中來回切換的應用的表現。
在此查閱有關統一的Angular位置服務的更多信息
我們還記錄了從Angular中懶加載應用中AngularJS部分的最佳實踐,這樣就能更容易地遷移最常用的功能,並且只爲應用程序的子集加載AngularJS。
在此查閱關於懶加載AngularJS的更多信息。
新的棄用指南
Angular的重大版本都是高度穩定的,每個重大版本都會對語義版本做一致管理。對於公共API而言,我們對舊功能的支持週期是N+2版本,意味着8.1中不推薦使用的功能將繼續在下兩個重大版本(9和10)中得到支持。例如,我們在8.0中棄用了platform-webworker功能。
現在用戶更容易在Angular中找到棄用和刪除的功能說明。查閱新的棄用指南瞭解所有棄用功能的完整列表。