热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

mavenupdate自动修改dynamicwebmodule_Angular8.0正式发布!支持更多Web标准

作者|StephenFluin译者|王强Angular8.0.0版本正式发布了!8.0是重大版本升级,整个平台,包括框架、AngularM
f4cdae5c22a09d08c614d78a5ea7212b.png 作者 | Stephen Fluin 译者 | 王强 Angular 8.0.0 版本正式发布了!8.0 是重大版本升级,整个平台,包括框架、Angular Material 和 CLI 都同步升级到了新版。Angular 8.0 版缩短了应用在现代浏览器上的启动时间,提供了用于访问 CLI 的新 API,并使 Angular 支持更多 Web 标准,追上了 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 会生成并标记两个包。

运行时,浏览器使用脚本标记上的属性来加载正确的包。

// 新版 JS // 老式 JS

在 angular.io 上,为现代浏览器节省了超过 40kB 的初始包大小。根据社区反馈,应用程序通常可以节省 7-20%的捆绑包大小,具体取决于用户使用了多少新版 Javascript 功能。

f3f28d068548596c382afc93df23bb75.png

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 将自动更新代码以应用新方式。

CLI 中的构建器 API

就像 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 建议的方式构建和部署你的应用程序。

CLI 中的 Workspace API

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

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

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

支持 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 的更多信息

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

AngularJS 迁移改进

如果你在 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


7a06a2ddf64c9d7edfe9b582c66da5e4.gif

点个在看少个 bug ?




推荐阅读
  • 实践指南:使用Express、Create React App与MongoDB搭建React开发环境
    本文详细介绍了如何利用Express、Create React App和MongoDB构建一个高效的React应用开发环境,旨在为开发者提供一套完整的解决方案,包括环境搭建、数据模拟及前后端交互。 ... [详细]
  • 在现代前端开发中,组件化已成为不可或缺的技术,尤其在 React 和 Vue 生态中。然而,组件的管理和测试一直是开发者面临的挑战。本文将介绍如何使用 Storybook 来简化这一过程,提高开发效率。 ... [详细]
  • 本文整理了一份基础的嵌入式Linux工程师笔试题,涵盖填空题、编程题和简答题,旨在帮助考生更好地准备考试。 ... [详细]
  • 长期从事ABAP开发工作的专业人士,在面对行业新趋势时,往往需要重新审视自己的发展方向。本文探讨了几位资深专家对ABAP未来走向的看法,以及开发者应如何调整技能以适应新的技术环境。 ... [详细]
  • JavaScript 实现图片文件转Base64编码的方法
    本文详细介绍了如何使用JavaScript将用户通过文件输入控件选择的图片文件转换为Base64编码字符串,适用于Web前端开发中图片上传前的预处理。 ... [详细]
  • H5技术实现经典游戏《贪吃蛇》
    本文将分享一个使用HTML5技术实现的经典小游戏——《贪吃蛇》。通过H5技术,我们将探讨如何构建这款游戏的两种主要玩法:积分闯关和无尽模式。 ... [详细]
  • Docker安全策略与管理
    本文探讨了Docker的安全挑战、核心安全特性及其管理策略,旨在帮助读者深入理解Docker安全机制,并提供实用的安全管理建议。 ... [详细]
  • 理解浏览器历史记录(2)hashchange、pushState
    阅读目录1.hashchange2.pushState本文也是一篇基础文章。继上文之后,本打算去研究pushState,偶然在一些信息中发现了锚点变 ... [详细]
  • 本文将从基础概念入手,详细探讨SpringMVC框架中DispatcherServlet如何通过HandlerMapping进行请求分发,以及其背后的源码实现细节。 ... [详细]
  • Jupyter Notebook多语言环境搭建指南
    本文详细介绍了如何在Linux环境下为Jupyter Notebook配置Python、Python3、R及Go四种编程语言的环境,包括必要的软件安装和配置步骤。 ... [详细]
  • 深入解析WebP图片格式及其应用
    随着互联网技术的发展,无论是PC端还是移动端,图片数据流量占据了很大比重。尤其在高分辨率屏幕普及的背景下,如何在保证图片质量的同时减少文件大小,成为了亟待解决的问题。本文将详细介绍Google推出的WebP图片格式,探讨其在实际项目中的应用及优化策略。 ... [详细]
  • 本文详细介绍如何在华为鲲鹏平台上构建和使用适配ARM架构的Redis Docker镜像,解决常见错误并提供优化建议。 ... [详细]
  • Python Requests模块中的身份验证机制
    随着Web服务的发展,身份验证成为了确保数据安全的重要环节。本文将详细介绍如何利用Python的Requests库实现不同类型的HTTP身份验证,包括基本身份验证、摘要式身份验证以及OAuth 1认证等。 ... [详细]
  • 本文介绍了如何在Linux系统中获取库源码,并在从源代码编译软件时收集所需的依赖项列表。 ... [详细]
  • MOSS2007 中型服务场配置指南:网络负载均衡集群设置
    本文详细介绍了如何在MOSS2007环境中配置网络负载均衡集群,包括安装和配置网络负载均衡功能的具体步骤。通过本文,读者可以了解如何在多台Web服务器上安装并配置网络负载均衡,以实现高效的服务分发。 ... [详细]
author-avatar
手机用户2702936061
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有