Angular v15 正式发布


在过去的一年里,Angular 团队删除了 Angular 的传统编译器和渲染管道,因此在过去几个月里 Angular 改进了一系列与开发者体验相关的内容。Angular v15 则是进一步推动了这项工作,它有几十项改进,使开发者有更好的体验和性能。

独立 API 脱离开发者预览版

在 Angular 14 中,引入了新的独立 API,使开发者能够在不使用 NgModules 的情况下构建应用程序。如今在 Angular 15 中,这些 API 已经脱离了开发者预览,现在是稳定的 API 的一部分。从现在开始,我们将按照语义版本的方式逐步改进它们。

Directive composition API

指令组合式 API(Directive composition API) 将代码重用带到了另一个层次,这项功能的灵感来自于 GitHub 上最受欢迎的功能请求(feature request),该请求要求提供向宿主元素(Host Element)添加指令的功能。

指令组合式 API 使开发者能够用指令来增强宿主元素,并为 Angular 配备了强大的代码重用策略,指令组合 API 只适用于独立的指令。

Image 指令现在稳定了

在 Angular 14.2 中,Angular 带来了与 Chrome Aurora 合作开发的 Angular image 指令的开发者预览版。

如今在 Angular 15 中,该指令现在已经达到稳定了,Land's End 对这一功能进行了实验,在 lighthouse lab 测试中观察到 LCP 有 75% 的改善。

更好的堆栈跟踪

Angular 团队从每年的开发者调查中得到了很多启示,在深入研究开发者面临的调试难题后,团队发现错误信息可能需要得到一些改进。

饼状图显示,大多数开发者在理解 Angular 中的错误信息时都很困难。因此 Angular 与 Chrome DevTools 合作来解决这个问题。

示例:

ERROR Error: Uncaught (in promise): Error
Error
at app.component.ts:18:11
at Generator.next (<anonymous>)
at asyncGeneratorStep (asyncToGenerator.js:3:1)
at _next (asyncToGenerator.js:25:1)
at _ZoneDelegate.invoke (zone.js:372:26)
at Object.onInvoke (core.mjs:26378:33)
at _ZoneDelegate.invoke (zone.js:371:52)
at Zone.run (zone.js:134:43)
at zone.js:1275:36
at _ZoneDelegate.invokeTask (zone.js:406:31)
at resolvePromise (zone.js:1211:31)
at zone.js:1118:17
at zone.js:1134:33

这个片段有两个主要问题:

  • 只有一行对应于开发人员编写的代码。 其他一切都来自第三方依赖项(Angular 框架、Zone.js、RxJS)
  • 没有关于导致错误的用户交互的信息

Chrome DevTools 团队创建了一种机制,通过 Angular CLI 注释 source maps 来忽略来自 node_modules 的脚本。还合作开发了一个异步堆栈标记 API,允许我们将独立的、预定的异步任务连接成一个堆栈跟踪。

将基于 MDC 的组件发布到稳定版

我们很高兴地宣布,基于 Material Design Components for Web(MDC)的 Angular material 组件的重构工作已经完成。这一变化使 Angular 更加接近 Material Design 规范。

对于许多组件,Angular 更新了样式和 DOM 结构,而其他组件则从头开始重写了。Angular 为新组件保留了大部分 TypeScript API 和组件/指令选择器,与旧的实现方式相同。

实验性 esbuild 支持的改进

在 Angular 14 中,Angular 带来了在 ng build 中实验性地支持 esbuild,以实现更快的构建时间并简化 Angular 管道。

在 v15 中,现在有了实验性的 Sass、SVG 模板、文件替换和 ng build --watch 支持。

语言服务中的自动导入

语言服务现在可以自动导入你在模板中使用但没有添加到独立组件或 NgModule 中的组件。

CLI 改进

在 Angular CLI 中,引入了对独立稳定 API 的支持。现在你可以通过 ng g component --standalone 生成一个新的独立组件。

Angular 也在进行简化 ng new 输出的任务。作为第一步,通过删除 test.tspolyfills.tsenvironments 来减少配置。现在你可以直接在 angular.json 中的 polyfills 部分指定你的polyfills。

"polyfills": [
"zone.js"
]

为了进一步减少配置开销,现在使用 .browserlist 来让你定义目标 ECMAScript 版本。

社区贡献

自 v14 发布以来,Angular 收到了 210 多人对框架、组件和 CLI 的贡献。

更多详情可查看:https://github.com/angular/angular/releases/tag/15.0.0


相關推薦

2022-11-28

最受欢迎的开源前端框架 Angular 终于推出了另一个版本更新——Angular 15。之前,Angular 14引入了许多新的令人兴奋的实验性功能和排列的代码最佳实践,但看起来这个新版本——在 Angular 版本 15 中,一切都是为了获得稳定性。

2023-05-04

在之前的 Angular v15 中,Angular 团队通过将独立 API 从开发者预览版升级至稳定版,在 Angular 的简易性和开发者体验方面达到了一个重要的里程碑。如今,Angular 将继续这一改进的势头,发布了自 Angular 最初推出以来最大的一次版

2022-09-28

者关系工程师 Emma Twersky 发表了一个主题为"What’s New with Angular"的讲话。演讲的很大一部分内容集中在 Angular 的过去迭代以及这些变化如何为谷歌下一步的工作奠基。 Twersky 透露,Angular 第 15 版计划在 11 月发布。届时谷歌将引

2023-01-08

代码时自动导入组件和其他符号 (WEB-32784)。 这也适用于 Angular。 针对 Angular 的新功能。 除 WEB-32784 外,还想针对 Angular 实现两个新功能。 对于 v15 将添加一项检查,建议对 img 使用 ngSrc 而不是 src 

2022-08-28

ng-zorro-antd 是 Ant Design 的 Angular 实现,主要用于研发企业级中后台产品。全部代码开源并遵循 MIT 协议,任何企业、组织及个人均可免费使用。 ng-zorro-antd 14.0.0 正式发布,更新内容如下: 安装 ng-zorro-antd $ cd PROJECT-NAME $ ng add ng

2023-02-24

Angular 是一个基于 TypeScript 的开源前端框架,由 Google 的 Angular 团队以及社区共同领导,从 AngularJS 完全重写而成。 目前 Angular v15.2.0 已发布,带来如下变更: 弃用类、InjectionToken 和冲突解决程序( #47924 ) 将加载程序参数

2023-06-15

Angular 是一个基于 TypeScript 的开源前端框架,由 Google 的 Angular 团队以及社区共同领导,从 AngularJS 完全重写而成。 目前 Angular v16.1.0 已发布,带来如下变更: compiler fix:在 JIT 模式下读取编译输入转换元数据时出错 (#50600)

2023-07-01

L 功能,同时兼具 NoSQL 数据库的可扩展性。 Vitess 17 近日正式发布,在这个版本中,Vitess 引入了一些重要的改进措施,以提高系统的兼容性、性能和可用性。 GA 公告 在 v15 版本中引入的 VTTablet 设置连接池功能,在这个版本中

2023-01-12

Angular 是一个基于 TypeScript 的开源前端框架,由 Google 的 Angular 团队以及社区共同领导,从 AngularJS 完全重写而成。 目前 Angular v15.1.0 已发布,带来如下变更: 弃用:路由器 路由器中的 CanLoad 已弃用,请改用 CanMatch 。 普通变

2023-02-16

了,ng-zorro-antd-mobile 是 Ant Design 移动规范的 Angular 实现,服务于阿里巴巴集团数据无线业务。 该版本更新内容如下: Features all: 修改站点版本 (9f6b8cc) all: 支持 Angular 15 (fd4adba) all: 支持import-by-mod

2023-07-15

序不符。 因此,作者提出了一个问题:这种变化是否像 Angular.js 转向 Angular 2 一样大?React 是否正在经历类似于 Angular.js 的阶段? 文章指出,React 的核心仍然是一个视图库,这一点没有改变:使用 React 服务器组件,您仍然

2022-01-10

AngularJS 是一个基于 JavaScript 的开源前端框架,它主要由 Google 以及个人和公司所组成的社区进行维护。日前 AngularJS 已经达到了生命周期终止的状态(EOL),未来将不再获得任何支持与维护,Angular 团队希望现有用户能够迁

2022-01-19

AngularJS 是一个基于 JavaScript 的开源前端框架,它主要由 Google 以及个人和公司所组成的社区进行维护。日前 AngularJS 已经达到了生命周期终止的状态(EOL),未来将不再获得任何支持与维护,Angular 团队希望现有用户能够迁移到

2022-07-26

发布了。这次更新的新功能使 WebStorm 变得更好,包括对 Angular 独立组件的支持,对 Vue 3 的更新,对 TypeScript 4.7 的支持,内置远程开发,以及对编辑器的大量改进。 对 Angular 独立组件的支持 Jetbrains 一直在积极致力于为 WebStor