Angular的6.0.0版本發佈了!這個主要版本不多關注底層框架,更多關注工具鏈,以及怎樣使它更容易快速適應Angular的將來變化。html
做爲本版本的一部分, 咱們正在同步框架包(@angular/core,@angular/common,@angular/compile等r)、Angular CLI和Angular Material + CDK的主要版本。今天所有發佈爲6.0.0。咱們進行了此更改以澄清交叉兼容性。這些項目的次要版本和補丁版將根據項目的須要發佈。
查看咱們更新日誌中的完整的更改列表:framework,material + cdk,cli。git
ng update <package>是一個CLI新命令,可分析您的package.json,並使用Angular知識向您的應用程序推薦更新。要看它的實際操做,請查看咱們的更新指南。github
ng update不只能夠幫您採用正確的依賴版本,並保持您的依賴關係同步,第三方也可使用原理圖提供更新腳本。若是您的某個依賴項提供了一個ng update原理圖,那麼他們能夠在須要進行重大更改時自動更新代碼!npm
ng update將不會取代你的軟件包管理器,而是基於npm或yarn來管理依賴關係。除了更新依賴關係和對等關係外,ng update還會將所需的變換應用於您的項目。json
例如,ng update @angular/core該命令將更新全部的Angular框架包以及RxJS和TypeScript,並將運行這些包中的任何可行的原理圖以保持最新狀態。做爲這個命令的一部分,咱們將自動安裝rxjs-compat到您的應用程序中,讓RxJS v6的使用更加流暢。bootstrap
咱們但願在接下來的幾個月裏看到更多的庫和包會添加ng update原理圖,而且已經聽到企業組件庫團隊將使用ng update以自動化方式推進重要更改以節省開發人員的時間。安全
瞭解有關ng update命令如何工做的更多信息。要開始建立您本身的ng update原理圖,請查看rxjs的package.json及其關的collection.json。架構
另外一個CLI新命令ng add <package>使您的項目更容易添加新功能。ng add將使用你的軟件包管理器下載新的依賴關係並調用一個安裝腳本(做爲原理圖實現),它可使用配置更新項目。更改、添加其餘依賴項 (例如 polyfills) 或腳手架包特定的初始化代碼。
如今能夠在ng new新建的應用程序中嘗試一下如下功能:app
因爲ng add創建在原理圖和npm註冊之上,咱們但願庫和社區可以幫助咱們創建一個豐富的ng add支持包生態系統。
以Angular Material的ng-add原理圖爲例,以幫助您開始構建本身的ng-add原理圖。框架
Angular Elements的第一個版本專一於容許您在現有的Angular應用程序中引導Angular組件,方法是將它們註冊爲自定義元素。咱們在angular.io中普遍使用它做爲咱們的內容管理系統的一部分,以容許經過嵌入式HTML動態引導功能。這取代了在靜態html內容中手動引導Angular組件的需求。
查看將組件註冊爲自定義元素的示例或瞭解有關Angular Elements的更多信息。
強烈推薦咱們的一位社區成員製做的Angular Elements快速入門視頻。
最大的亮點是新增了用於顯示分層數據的樹型組件。遵循數據表組件的模式,CDK包含核心樹指令,而Angular Material則提供與頂層的Material Design樣式相同的體驗。咱們最近談到了這個組件,因此請查看更多信息(視頻,幻燈片)。這些新的樹型組件都有樣式(Materail mat-tree)和無樣式(CDK cdk-tree)兩種版本。
除了樹型組件,咱們也有新的badge和bottom-sheet組件。badge組件有助於顯示少許有用的信息,例如未讀項目計數。bottom-sheet組件是從視口底部出現的一種特殊類型的以移動爲中心的對話框,一般用於顯示動做後的選項列表。
@angular/cdk/overlay軟件包是CDK當今最強大的基礎架構之一。隨着v6的發佈,該軟件包如今包含新的定位策略,可幫助在全部狀況下智能地保持屏幕上的彈出窗口。
使用ng add命令爲您的項目添加dashboard
一旦運行ng add @angular/material添加Material到現入門應用程序,同時也將生成3個新的入門組件。
Material Sidenav
您如今能夠生成包含具備應用程序名稱和側邊導航的工具欄的入門組件。該組件基於斷點進行響應。
運行:
ng generate @angular/material:material-nav --name=my-nav
這將建立以下入門組件:
Material Dashboard
如今您能夠生成包含動態網格卡片列表的入門組件Dashboard。
運行:
ng generate @angular/material:material-dashboard --name=my-dashboard
Material Data Table
您能夠生成一個初始數據表組件,該組件已預先配置了一個datasource用於排序和分頁的組件。
運行:
ng generate @angular/material:material-table --name=my-table
這將建立以下入門組件:
CLI v6如今支持包含多個項目的工做區,如多個應用程序或庫。CLI項目如今將使用angular.json取代angular-cli.json來構建和配置項目。
每一個CLI工做區都有項目,每一個項目都有目標,每一個目標均可以有配置。
{ "projects": { "my-project-name": { "projectType": "application", "architect": { "build": { "configurations": { "production": {}, "demo": {}, "staging": {}, } }, "serve": {}, "extract-i18n": {}, "test": {}, } }, "my-project-name-e2e": {} }, }
ng generate library <name>
已有庫添加庫支持
該命令將在CLI工做區內建立一個庫項目,並對其進行配置以進行測試和構建。
爲了使您的應用程序更小,咱們已經將引用服務的模塊轉換爲引用模塊的服務。如今咱們只需將服務綁定到注入模塊的代碼庫中。
以前
@NgModule({ ... providers: [MyService] }) export class AppModule {}
import { Injectable } from '@angular/core'; @Injectable() export class MyService { constructor() { } }
以後
import { Injectable } from '@angular/core'; @Injectable({ providedIn: 'root', }) export class MyService { constructor() { } }
咱們已經更新了動畫的實現,再也不須要網頁動畫填充代碼。這意味着您能夠從應用程序中刪除此polyfill,並節省大約47KB的生產包大小,同時增長Safari中的動畫性能。
Angular已更新爲使用RxJS的v6版本。RxJS是幾個星期前發佈v6的獨立項目。RxJS v6帶來了幾個主要的變化,還有一個向下兼容的軟件包>rxjs-compat,可讓你的應用程序保持運行。
RxJS已重構使其更tree-shakable,確保只有您使用的 RxJS片段包含在您的生產包中。
若是您使用ng update,您的應用程序應該繼續工做,但您能夠了解有關5.5到6.0遷移的更多信息。
咱們正在將長期支持擴展到全部主要版本。
以前咱們宣佈只有v4和v6有LTS版本,但爲了使從一個主要到下一個更新更容易,並給更大項目規劃更多更新的時間,咱們決定將從v4開始延長對全部主要版本的長期支持。
每一個主要版本將支持18個月,大約6個月的積極開發,接下來是12個月的關鍵錯誤修正和安全補丁。
詳細瞭解Angular版本和發佈。
update.angular.io獲取更新您的應用程序的信息和指導。
更新一般遵循3個步驟,並將使用ng update新命令。
讓開發人員輕鬆掌握最新版本對咱們來講很是重要,因此讓咱們知道您在評論中對此版本的見解!
咱們在ng-conf提到了一個名爲Ivy的倡議:咱們的下一代渲染引擎。Ivy目前正在積極開發中,不屬於6.0版本的一部分。咱們將在將來幾個月內儘快宣佈Ivy的選擇性預覽版。請留意此博客中的最新信息。