11 月 19 - 20 日 Apache Pulsar 社区年度盛会来啦,立即报名! 了解详情
写点什么

Angular 重大版本升级: 8.0 正式发布! 支持更多 Web 标准

  • 2019-05-30
  • 本文字数:2105 字

    阅读完需:约 7 分钟

Angular重大版本升级: 8.0正式发布!支持更多Web标准

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 的博客文章,或查阅API文档


我们也在与云服务商合作以利用这些 API。现在你可以试一下最新版本的AngularFire,它增加了一个 deploy 命令,让构建和部署到 Firebase 的工作变得非常简单:


ng add @angular/fireng 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 Location 服务上。这会改善使用 ngUpgrade,需要在 AngularJS 和 Angular 部分中来回切换的应用的表现。


在此查阅有关统一的Angular位置服务的更多信息


我们还记录了从 Angular 中懒加载应用中 AngularJS 部分的最佳实践,这样就能更容易地迁移最常用的功能,并且只为应用程序的子集加载 AngularJS。


在此查阅关于懒加载AngularJS的更多信息


新的弃用指南

Angular 的重大版本都是高度稳定的,每个重大版本都会对语义版本做一致管理。对于公共 API 而言,我们对旧功能的支持周期是 N+2 版本,意味着 8.1 中不推荐使用的功能将继续在下两个重大版本(9 和 10)中得到支持。例如,我们在 8.0 中弃用了 platform-webworker 功能。


现在用户更容易在 Angular 中找到弃用和删除的功能说明。查阅新的弃用指南了解所有弃用功能的完整列表


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



2019-05-30 11:2320620

评论

发布
暂无评论
发现更多内容

食堂就餐卡系统设计

傻傻的帅

系统设计

架构师训练营No.1周总结

连增申

食堂就餐卡-系统设计文档

王凯

带你了解 Ribbon 负载均衡器的实现

张晓辉

Spring Cloud

第一周学习总结

CP

极客时间第0期架构师训练营第一周作业1

2流程序员

食堂就餐卡系统架构设计文档

冯凯

极客大学架构师训练营

第一周作业--食堂就餐卡系统系统

技术小生

极客大学架构师训练营 UML

架构师训练营学习总结

王凯

食堂就餐卡系统架构设计

James-Pang

极客大学架构师训练营

第一周学习总结

冯凯

极客大学架构师训练营

作业一:食堂就餐卡系统设计

Safufu

架构师作业

老姜

极客大学架构师训练营

架构师训练营-作业2-学习总结

狂奔嘀兔纸

极客大学架构师训练营

架构师训练营第一周作业

陈靓-哲露

【架构师训练营-周总结-1】

小动物

总结 极客大学架构师训练营

架构师训练营第一周总结

路人

架构师训练营-第一章-uml练习作业

而立

极客大学架构师训练营

架构师训练营第一周作业

不谈

极客大学架构师训练营

架构师训练营第一周 - 食堂就餐卡系统设计

Eric

极客大学架构师训练营

程序员为什么技术这么厉害,赚得钱却不多?

金刚小书童

程序员 职业规划 技术管理

第一周学习总结

王铭铭

架构师训练营-学习总结-第一讲

吕浩

学习 极客大学架构师训练营

架构师训练营学习心得【第一周】

王海

极客大学架构师训练营

架构师第一周作业

路人

架构师课作业-第一周-架构文档

Tulane

极客大学架构师训练营

架构师训练营第一周学习总结

James-Pang

极客大学架构师训练营

架构与UML总结

GalaxyCreater

plantUML的安装和使用

技术小生

极客大学架构师训练营

食堂就餐卡系统设计文档

架构5班杨娟Jessie

极客大学架构师训练营

2020/06/09 架构师学习心得

架构5班杨娟Jessie

极客大学架构师训练营

Angular重大版本升级: 8.0正式发布!支持更多Web标准_语言 & 开发_Stephen Fluin_InfoQ精选文章