Angular 8 發佈

原文地址:https://blog.angular.io/version-8-of-angular-smaller-bundles-cli-apis-and-alignment-with-the-ecosystem-af0261112a27

Angular 8 - 更小的包，CLI API 以及與生態保持一致

Angular 8 如今發佈了！這是跨越整個平臺的重要發佈，包括框架、Angular Material，與主版本同步的 CLI。該發佈改進了應用程序在現代瀏覽器上的啓動時間，提供了開發 CLI 的新的 API，保持了 Angular 與業界生態和更多新的 Web 標準的同步。

如何升級到版本 8

訪問 update.angular.io 能夠獲得詳盡信息和指導。對於大多數開發者來講，只要下面的一個命令就能夠完成這次升級：

ng update @angular/cli @angular/core

　　

默認的區分加載

區分加載 是瀏覽器基於其自身的能力在現代或者遺留 JavaScript 之間選擇的過程。如今，默認對你的應用程序執行現代的 ( es2015 ) 和 遺留 ( es5 ) 構建，咱們能夠從中獲取好處。當用戶加載應用程序的時候，它們能夠自動使用須要的構建包。

若是你使用 ng update 命令，咱們會升級你的 tsconfig.json 來幫助你從中獲益。咱們的 CLI 會檢查你的 tsconfig.json 中的 target JavaScript 等級來決定是否從區分加載中獲益。

{
  "compilerOptions": {
  …
  "module": "esnext",
  "moduleResolution": "node",
  …
  "target": "es2015",
  …
},

當 target 設置爲 es2015 的時候，咱們會生成並標記兩種發佈包。

在運行時，瀏覽器使用在 <script> 元素上的 attribute 來加載正確的包。

• <script type="module" src="..."> 加載現代版的 JavaScript

• <script nomodule src="..."> 加載遺留版的 Javascript

對於 angular.io 來講，對於現代瀏覽器，咱們的初始化包節省了超過 40Kb 尺寸。經過來自社區的反饋，咱們聽到了應用程序一般節省了 7 - 20% 的尺寸，基於現代 JavaScript 的特性獲取了增益。

 

使用動態導入的路由配置

咱們強烈建議使用 router 延遲加載應用程序的各個部分。這能夠經過在路由配置中使用 loadChildren 關鍵字來實現。

之前看起來是這樣的：

{path: '/admin', loadChildren: './admin/admin.module#AdminModule'}

　　

該語法是 Angular 定製語法，與工具鏈構建在一塊兒。在 Angular 8 中，咱們遷移到了工業標準的 dyanmic imports。

如今，這樣使用：

{
    path: `/admin`, 
    loadChildren: () => import(`./admin/admin.module`)
                            .then(m => m.AdminModule)
}

　　

CLI 中的構建器 API

與 Schematics 容許你利用 ng new ，ng generate ，ng ad 和 ng update 一樣的方式， 咱們發佈了新的構建器 API，容許你利用 ng build ，ng test 和 ng run 來執行你指望的構建和發佈。

請查閱 咱們關於新 API 的博客

或者閱讀：API 文檔

咱們還已經開始與雲供應商合做來從這些 API 中獲益。如今你能夠嘗試最新版本的 AngularFire ，它增長了一個 ng deploy 命令，使得構建和發佈到 Firebase 比之前更加簡單：

ng add @angular/fire
ng run my-app:deploy

　　

一旦安裝以後，部署命令將經過 AngularFire 同時進行構建和發佈應用程序。

CLI 中的工做區 API

之前使用 Schematics 的開發者不得不手動大齡和修改他們的 angular.json 文件來修改工做區配置。使用 8.0，咱們引入了一個新的 API 使得該文件更易讀和修改。

請參考 Workspace API

Web Worker 支持

若是你須要作任何 CPU 密集的處理的時候，Web worker 是加速應用程序的很是棒的途徑。Web worker 容許你將工做轉移到後臺線程上，好比圖像或者視頻處理，咱們在 angular.io 中使用 Web worker 進行應用內的搜索索引。

如今，你能夠經過 CLI 來生成一個 Web worker。添加 worker 到項目中，能夠執行：

ng generate webWorker my-worker

　　

一旦你有了 Web worker，你能夠在應用程序中正常使用它，CLI 還能夠幫助你打包並對它正確地進行代碼分割。

const worker = new Worker('./my-worker.worker', { type: 'module'} );

　　

請閱讀 web worker in the Angular CLI

AngularJS 遷移改進

若是你在 AngularJS 應用程序中使用了 $location service，Angular 如今提供了 LocationUpgradeModule ，容許將 Location 服務統一從 AngularJS 的 $location 切換到 Angular 的 Location 服務。 這應該能夠改進須要在應用程序中同時使用 AngularJS 和 Angular 的應用程序。

請查閱 Unified Angular Location Service

咱們還提供了關於在 Angular 中延遲加載 AngularJS 應用部分的最佳實踐文檔，首先使得常見使用的功能容易遷移，你的應用程序僅僅加載 AngularJS 的子集。

請查閱 Lazy Loading AngularJS

新的不建議使用手冊

咱們提供更高等級的跨主要版本的維護語義版本穩定性。對於咱們的 Public API，咱們提供 N + 2 支持。這意味着若是一個特性從 8.1 開始不建議使用，咱們將在下兩個主要版本繼續支持 ( 9 和 10 ) 。例如，咱們在版本 8 中不建議的 platform-webworker。

咱們在使得在 Angular 中更容易發現不建議使用的內容並刪除它。對於全部不建議使用的功能列表，請查閱新的 不建議使用手冊

Ivy & Bazel

咱們知道有大量的對於即將到來的可選預覽的期待。咱們將在下週的博客中進行單獨更新，