Angular 10新功能和更新
Angular 10现在正式可用,并且越来越好。 我已经编写了有关如何升级到Angular 10的教程。如果您不知道,请签出。
Angular 10具有以下版本的依赖关系。
- rxjs 6.5.5
- 打字稿3.9.5
- webpack 4.43.0
这个版本比平时要小。 自从我们发布Angular 9.0版本以来只有四个月。
如何安装Angular 10
如果以前尚未安装Angular,则可以使用以下命令安装Angular CLI。
npm install @angular/cli@next -g
这将安装CLI,现在要创建新的Angular 10项目,您必须键入以下命令。
ng new angular10tutorial
这将创建一个全新的Angular 10项目。
Angular 10新功能和更新
Angular 10附带了新的日期范围选择器。
Angular Material现在包括新的日期范围选择器。
要使用新的日期范围选择器,可以使用mat-date-range-input和mat-date-range-picker组件。
您可以在StackBlitz上看到新的Date Range Datepicker示例。
有关CommonJS导入的警告
当您使用CommonJS附带的依赖项时,它会导致应用程序更大,更慢。
从Angular版本10开始,现在当您构建这些捆绑软件之一时,Angular引擎会向您发出警告。
如果您开始对依赖项看到这些警告,请让您的依赖项知道您更喜欢ECMAScript模块(ESM)捆绑包。
当您运行ng build –prod命令时,如果您使用的是CommonJS,它将警告我们。 这还具有默认情况下对新项目禁用ES5构建的副作用。
要为需要它的浏览器(例如IE或UC浏览器)启用ES5构建和差异加载,只需在.browserslistrc文件中添加需要支持的浏览器。
与生态系统保持同步
和往常一样,Angular团队对Angular的依赖项进行了一些更新,以保持与JavaScript生态系统的同步。
- Angular现在使用TypeScript 3.9(TypeScript的改进版本)。
- TSLib已更新至v2.0。
- TSLint已更新至v6。
他们还更新了我们的项目布局。
从版本10开始,您将看到新的tsconfig.base.json。 这个额外的tsconfig.json文件更好地支持IDE(Webstorm)和构建工具解析类型和程序包配置的方式。
新的默认浏览器配置
他们已为新项目更新了浏览器配置,以排除较旧和较少使用的浏览器。
要查看浏览器列表,请键入以下代码。
npx browserslist chrome 83 edge 83 edge 81 firefox 77 firefox 68 ios_saf 13.4-13.5 ios_saf 13.3 ios_saf 13.2 ios_saf 13.0-13.1 ios_saf 12.2-12.4 ios_saf 12.0-12.1 safari 13.1 safari 13 safari 12.1 safari 12
可选的更严格设置
使用ng new创建新工作区时,Angular 10提供了更为严格的项目设置。
ng new --strict
启用此标志以使用一些新设置初始化您的新项目可以提高可维护性,帮助您提前捕获错误,并使Angular CLI在我们的应用程序上执行高级优化。 严格标志执行以下操作:
- 它在TypeScript中启用严格模式。
- 将模板类型检查设置为“严格”。
- 默认的捆绑包预算已减少了约75%。
- 它配置起毛规则以防止声明任何类型。
- 它将您的应用配置为无副作用,以实现更高级的树状摇动。
弃用和移除
Angular软件包格式不再包含ESM5或FESM5软件包,在为Angular软件包和库运行yarn或npm install时,可节省119MB的下载和安装时间。
不再需要这些格式,因为在构建过程结束时将完成任何下级支持ES5的操作。
在与社区进行大量协商的基础上,我们不再支持旧版本的浏览器,包括IE 9、10和Internet Explorer Mobile。
这篇Angular 10新功能和更新文章就是这样。