Angular v6 正式發布

Angular 6 正式發布

?Angular 6 已經正式發布了!這個主要版本并不關注于底層的框架,更多地關注于工具鏈,以及使 Angular 在未來更容易快速推進。

作為發布的一部分,我們同步了主要的框架包??(@angular/core, @angular/common, @angular/compiler, etc),? Angular CLI, 以及 Angular Material + CDK。現在全部都是作為 6.0.0 發布。我們理清了它們之間的兼容性。小的更新的補丁將會基于項目的需要發布。

可以通過每個項目的變更清單來查看全部的內容:?framework, material+cdk, cli.

1. ng update

ng update <package>? 是一個新的 CLI 命令,用于分析 package.json 并使用其關于 Angular 的知識來更新您的應用。請查看升級手冊來查看其行為。

不僅可以使用 ng update 來幫助您適配正確版本的依賴項,并保持依賴同步,而且第三方也可以使用 schematics?來提供 update 腳本命令。如果您的某個依賴庫提供了 ng update 語法,在其有大更新的時候,就可以自動更新您的代碼了。

ng update 并不會替換您的包管理器,而是使用 npm 或者 yarn 在底層管理依賴,然后更新依賴,ng update 將對您的項目進行必要的轉換。

例如,ng update @angular/core 將會更新所有的 Angular 框架包,比如:RxJS 和 TypeScript,并運行這些包中可用的 schematics 來保持最新。作為命令的一部分,我們將會自動安裝 rxjs-compat 到您的應用中以平滑遷移。

我們期待更多的庫和包在隨后支持 ng update 語法,我們已經 聽到一些企業庫的團隊在計劃使用 ng update 來自動更新重要的變更升級,以減少開發時間。

學習更多關于如何使用 ng update?, 開始學習如何創建您自己的 ng update 語法,可以參考 rxjs 的 package.json 的入口,它關聯了??collection.json。

2. ng add

?另一個新的 CLI 命令是 ng add,它可以使您添加新包變得更加容易。ng add 將使用您的包管理器來下載新的依賴項,并運行安裝腳本(以 schematics 實現)。通過配置文件來更新項目。添加額外的依賴項(例如 polyfill 等),或者執行包特定的初始化代碼。

可以在您的使用 ng new 創建的新項目上試一下下面的命令:

  • ng add @angular/pwa, 通過為您的應用添加 manifest 文件和 service worker 將其轉換為 PWA 項目
  • ng add @ng-bootstrap/schematics, 將 ng-bootstrap 添加到項目中
  • ng add @angular/metarial, 安裝與設置 Angular Metarial ,并使用 ng generate 添加新的啟動組件。
  • ng add @clr/angular@next, 從 VMWare 安裝和設置 Clarity。
  • ng add @angular/elements, 為 Angular elements 安裝?document-register-element.js 和依賴項。

由于 ng add 基于 schematics 和 Npm ,我們希望庫和社區支持我們構建一個 ng add 支持包的生態圈。

請查看 Angular Metarial 的 ng add schemetic?,作為示例來幫助您開始創建您自己的 ng add。

3. Angular Elements

第一個版本的 Angular Elements 支持您在現有的 Angular 應用中通過注冊 Angular Component 作為自定義元素。我們在 angular.io 內容管理系統中使用這種擴展能力,通過嵌入 HTML 來支持動態。這替換掉了手動啟動 Angular 組件。

請查看注冊 Angular Component 作為 custom element,或者學習更多的 Angular Elements.

已經有一個社區成員發布了 Angular Elements Quick Start, 我們非常建議您參考。

4. Angular Metarial + CDK component

最大的更新是增加了新的 tree 組件以顯示層次結構,遵循 table 組件的模式,CDK 支持了核心 tree 指令,Angular Metarial? 通過 Metarial Design 提供了一致的體驗,我們最近提供了一個關于它的內容,可以參考(video, slide ).新的 tree 組件有兩種風格:(Metarial 風格)mat-tree 和未修飾的版本 cdk-tree

除了 tree 組件之外,我們還提供了 badge 和 bottom-sheet-components。徽章用于顯示小的幫助信息。例如未讀項目數量等等,Bottom-sheet? 是移動設備專用的對話框,通常用于提供一系列動作的選項。

@angular/cdk/overlay 是 CDK 中非常有用的包,在新的 v6 版中,其包含新的定位邏輯,以在各種場景下幫助彈出。

5. Angular Metarial Starter Components

一旦您執行 ng add @angular/metarial 將 Metarial 添加到您的項目中,您將得到 3 個新的 starter 組件:

Metarial SideNav

您現在可以生成一個包含 app 名稱的 toolbar 和邊欄導航的起步組件。

?執行

ng generate @angular/material:material-nav

?

將會生成這樣的起步組件。

Metarial Dashboard

您可以生成一個包含動態表格的卡片列表 。

執行

ng generate  @angular/material:material-dashboard

?

可以生成這樣的組件。

Material Data Table

您可以生成支持排序、分頁的預配置 datasource 的數據表組件。

執行

ng generate  @angular/material:material-table

?

將會生成這樣的組件。

在這里查看更多資料:Angular Material? Schematics

6. CLI Workspaces

Angular CLI v6 現在支持包含多個項目的工作空間,比如多個應用或者庫。CLI 項目現在將使用 angular.json 來替代 .angular-cli.json 進行配置和構建。

每個 CLI 可以有多個項目,每個項目有 target, 每個 target 有配置文件。

{"projects": {"my-project-name“: {"projectType": "application","architect": {"build": {"configurations”: {"production": {},"demo": {},"staging": {},}},"serve": {},"extrace-i18n": {},"test": {},}},"my-project-name-e2e": {}}
}

?

更多信息請參考:新的配置文件。

7. 庫的支持

被廣泛請求的一個 CLI 特性現在支持了:創建和構建庫。我很榮幸介紹它。

ng generate  library <name>

?

該命令將會在您的 CLI 工作空間創建一個庫項目,并配置其測試和構建。

更多信息請參考:使用 Angular CLI 創建庫

8. Tree Shakable 提供器

為使您的應用尺寸更小,我們從模塊引用服務變成了服務引用模塊。這使得我們可以僅僅打包模塊中注入到代碼中的服務。

以前

@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() {}
}

?

更多信息,參考依賴注入。

9. 動畫性能改進

我們已經更新了動畫實現,不再需要 Web animations polyfill,這意味著您可以從應用中刪除這個 polyfill,并節省大約 47K 的打包尺寸,同時提升了在 Safari 中的性能。

10. RxJS v6

Angular 已經升級到 RxJS v6。RxJS 是 Angular 的一個依賴項,其在幾周前正式發布了 v6。RxJS v6 帶來了多個重要的更新,還提供了反向兼容庫 rxjs-compat,可以保持您的應用繼續工作。

RxJS 進行了重新組織以便于 Tree shakable, 以確保只有用到的 RxJS 部分打包到應用中。

如果您使用 ng update, 您的應用將會保持工作,您可以從 RxJS 5.5 遷移到 6 得到更多信息。

11. 長期支持

我們擴展了我們的長期支持條款到所有主要發布版本。

以前,我們聲明只有 v4-v6 是長期支持的版本。但是為了是的從某個主要版本升級到下一個更加容易,并給予大的項目更多的時間來計劃升級,我們決定擴展到支持從 v4 開始的所有主要版本。

每個主要發布將會支持 18 個月,包括 6 個月的活動開發和 12 個月的關鍵 bug 修復和安全補丁。

更多信息可以參考 Angular 版本和發布。

12. 如何更新到 6.0.0

訪問 update.angular.io?來得到升級應用的信息和指導。

升級通常包括 3 步,并可以從 ng update 工具獲得好處。

  1. 升級 @angular/cli
  2. 升級 Angular 框架包
  3. 升級其它依賴

對于我們來說,讓開發者保持最新版本的更新特別重要,所以,如果您有什么建議請讓我們知道。

13. Ivy 怎么樣了?

關于我們下一代的渲染引擎 Ivy,Ivy 當前處于開發階段,還不是 v6 的一部分。在隨后的幾個月,我們將會宣告 Ivy 的一個預覽版。

See Also

  • Version 6 of Angular Now Avaiable

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/538749.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/538749.shtml
英文地址,請注明出處:http://en.pswp.cn/news/538749.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

bootstrap五星評分_如何用純代碼實現評分星級顯示?

showRatingStars/*** showRatingStars 顯示評分星級* param {Object} myCanvas 畫布對象* param {Number} rating 評分* param {Number} counts star個數* param {Number} size star大小* param {Object} style star樣式* Example: style {* borderColor:"#21DEEF",…

18.變量

Java是一種強類型語言&#xff0c;每個變量都必須聲明其類型。 Java變量是程序中最基本的存儲單元&#xff0c;其要素包括變量名&#xff0c;變量類型和作用域。 變量在使用前必須對其聲明&#xff0c;只有在變量聲明以后&#xff0c;才能為其分配相應長度的存儲單元。 注意事項…

alertdialog android api 11,android – 設備api級別11的DialogFragments

我設法在兼容包的DialogFragment.java中正確修復了這個問題&#xff1a;改變第74行&#xff1a;boolean mShowsDialog false;注釋掉第232行&#xff1a;// mShowsDialog mContainerId 0;然后將兩個show方法更改為&#xff1a;public void show(FragmentManager manager, Str…

py 字典添加多個value_# Python 3 # Python 3字典Dictionary(1)

Python3 字典字典是另一種可變容器模型&#xff0c;且可存儲任意類型對象。字典的每個鍵值(key>value)對用冒號(:)分割&#xff0c;每個對之間用逗號(,)分割&#xff0c;整個字典包括在花括號({})中 ,格式如下所示&#xff1a;d {key1 : value1, key2 : value2 }鍵必須是唯…

饒軍:Apache Kafka的過去,現在,和未來

歡迎大家前往騰訊云社區&#xff0c;獲取更多騰訊海量技術實踐干貨哦~ 本文首發在云社區&#xff0c;未經許可&#xff0c;不得轉載。大家好&#xff0c;我大概簡單的介紹一下&#xff0c;我叫饒軍&#xff0c;我是硅谷的初創公司Con?uent的聯合創始人之一&#xff0c;我們公司…

機器人 樹莓派 自閉癥_用機器人孩子提高社交能力 讓自閉兒童走出自閉

一項由耶魯大學的研究團隊研究發現&#xff0c;通過讓患有自閉癥譜系障礙(autism spectrum disorders,ASD)的孩童與機器人相處一個月&#xff0c;極大地提高了自閉癥兒童的社交能力。耶魯大學研究中的機器人可以通過眼神接觸和模仿其它社交行為&#xff0c;通過講故事和互動游戲…

19.常量-final

final 常量 final修飾&#xff0c;只能被初始化一次。 public static void main(String[] args){final int a3;a4;//報錯/*TestVariable.java:7: 錯誤: 無法為最終變量a分配值a4;^ 1 個錯誤*/}常量一般用大寫來修飾。 ------------- 更多的Java&#xff0c;Angular&#xff0c;…

Android手機avi轉換為mp4手機,如何把avi轉換為mp4

AVI是目前比較常見的一種音視頻交錯格式&#xff0c;這種格式的文件在多種地方是可以看到的&#xff0c;大多在游戲錄制、光盤文件中可以見到此類文件。其畫質不錯&#xff0c;適合在電腦上觀看&#xff0c;但是現在我們使用較多的是手機、iPad等設備。如果我們想要在這些設備上…

偽代碼書寫規范_C++代碼書寫規范(推薦新手程序員)

代碼就是程序員的面子&#xff0c;無論是在工作中在電腦上寫程序代碼還是在面試時在紙上寫演示代碼我們都希望寫出整潔&#xff0c;優雅的代碼。特別在工作中當我們碰到需要維護別人的代碼&#xff0c;或者是多人參與一個項目大家一起寫代碼的時候&#xff0c;如果碰到一些丑陋…

Java基礎17:Java IO流總結

版權聲明&#xff1a;本文為博主原創文章&#xff0c;未經博主允許不得轉載。 https://blog.csdn.net/a724888/article/details/80201802 這位大俠&#xff0c;這是我的公眾號&#xff1a;程序員江湖。 分享程序員面試與技術的那些事。 干貨滿滿&#xff0c;關注就送。 本文介…

nuxt頁面跳轉_nuxt 項目如何解決組件復用時頁面不刷新的問題

組件復用會在兩種情況下發生&#xff1a;1、使用 keep-alive 時&#xff0c;頁面再次跳轉時&#xff0c;數據不更新每一次路由的切換都會導致頁面被重新渲染&#xff0c;無論是各種鉤子還是異步獲取數據函數都會被執行&#xff0c;為了提高網站性能&#xff0c;可以使用 keep-a…

20.命名規范

所有變量&#xff0c;方法&#xff0c;類名&#xff1a;見名知意 變量&#xff0c;方法名 --首字母小寫和駝峰原則。 如&#xff1a;run(),getName() 常量 ---大寫字母和下劃線&#xff1a;MAX_VALUE 類名 ---首字母大寫和駝峰原則。 如&#xff1a;Man,HelloWorld ------…

k8s查看pod的yaml文件_K8s-yaml的使用及命令

YAML配置文件管理對象對象管理&#xff1a;# 創建deployment資源kubectl create-f nginx-deployment.yaml# 查看deploymentkubectl get deploy# 查看ReplicaSetkubectl get rs# 查看pods所有標簽kubectl get pods--show-labels# 根據標簽查看podskubectl get pods-l appnginx# …

Orange Business Services 全球發布 Easy Go Network,幫助企業加速實現“網絡即服務”...

100% 數字化, 軟件定義網絡( SDN) 產品在 75 個國家上市 在云、移動化、大數據和物聯網&#xff08;IoT&#xff09;趨勢的推動下&#xff0c;企業不斷尋求更加智能和更加靈活的網絡&#xff0c;以支持他們的數字化轉型方案。而網絡只有演進至“網絡即服務”&#xff08;NaaS&a…

vue的html自動刷新,Vue頁面刷新記住頁面狀態的實現

環境vue項目&#xff0c;頁面有搜索、篩選項等。需求頁面跳轉&#xff0c;切換或者刷新&#xff0c;希望可以記住用戶在頁面的篩選狀態方案v1vue有提供一種緩存組件的解決方案 — keep-alive。緩存不活動的組件實例&#xff0c;而不是銷毀它們。我們可以使用keep-alive包括路由…

python 程序停止打印日志_Python日志打印

簡單示例import sysimport ctypesimport loggingimport logging.handlersreload(sys)sys.setdefaultencoding(utf-8)LOG_FILE test_loglogging.basicConfig(filename LOG_FILE,format %(asctime)s - %(levelname)s -%(process)d- %(filename)s:%(funcName)s:%(lineno)d - %(…

21.和和instance of

>> 右移一位。相當于除2 << 左移一位。相當于乘2 public static void main(String[] args) {int a3<<2;int b12>>2;System.out.println("a"a);System.out.println("b"b);}解析&#xff1a; a3*2*212 b12/2/23 運行結果&#xf…

html語言閃爍特效代碼,css3 文字閃爍特效代碼

今天給大家分享幾個文字閃爍特效代碼&#xff0c;純css3代碼實現&#xff0c;對于新手小伙伴值得拿來學習一下。文字閃爍特效一通過改變透明度來實現文字的漸變閃爍&#xff0c;代碼如下&#xff1a;文字閃爍&#xff1a;閃爍效果.main{color: #666;margin-top: 50px;}/* 定義k…

keyshot怎么貼logo_如何使用KeyShot添加有織紋的Logo

如果你的產品上有企業logo&#xff0c;那么將logo作為一種材質(如鍍鉻貼紙)就很常見了&#xff0c;但不是在3D里建模logo&#xff0c;建模logo會產生額外的工作&#xff0c;還會降低建模的效率&#xff0c;不過KeyShot提供了一種簡單的方法&#xff0c;可以更快地實現相同的效果…