Angular 8.0 正式发布! 支持更多 Web 标准

用户可以访问 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

在此处查阅有关差异加载的详细信息。

https://v8.angular.io/guide/deployment#differential-loading

我们强烈建议用户使用路由懒加载应用的一些部分。可以在路由配置中使用 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 将自动更新代码以应用新方式。

就像 Schematics 能让你输入 ng new、ng generate、ng add 和 ng update 一样，我们发布的新版构建器 API 能让你输入 ng build、ng test 和 ng run 来执行构建和部署等任务。

可以查看介绍这些新 API 的博客文章，或查阅 API 文档

https://blog.angular.io/introducing-cli-builders-d012d4489f1b

https://v8.angular.io/guide/cli-builder

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

ng add @angular/fireng?run?my-app:deploy

安装 AngularFire 后，这个部署命令将以 AngularFire 建议的方式构建和部署你的应用程序。

以前，使用 Schematics 的开发者必须手动打开并修改 angular.json 来更改 workspace 配置。在 8.0 版本中我们引入了一个新的 API，使开发者能更容易地读取和修改这个文件。

在此查阅有关可用的 Workspace API 更多信息

https://github.com/angular/angular-cli/tree/master/packages/angular_devkit/core#workspaces

如果你需要运行一些 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 的更多信息

https://v8.angular.io/guide/web-worker

如果你在 AngularJS 应用中使用 location 服务，Angular 现在有了一个 LocationUpgradeModule 提供统一的位置服务，将定位任务从 AngularJSlocation 服务迁移到了 Angular Location 服务上。这会改善使用 ngUpgrade，需要在 AngularJS 和 Angular 部分中来回切换的应用的表现。

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

https://v8.angular.io/guide/upgrade#using-the-unified-angular-location-service

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

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

https://v8.angular.io/guide/upgrade#create-a-service-to-lazy-load-angularjs

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

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

https://v8.angular.io/guide/deprecations

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

点个在看少个 bug ?

关注公众号：拾黑（shiheibook）了解更多

[广告]赞助链接：

四季很好，只要有你，文娱排行榜：https://www.yaopaiming.com/
让资讯触达的更精准有趣：https://www.0xu.cn/