菜单 学习猿地 - LMONKEY

VIP

开通学习猿地VIP

尊享10项VIP特权 持续新增

知识通关挑战

打卡带练!告别无效练习

接私单赚外块

VIP优先接,累计金额超百万

学习猿地私房课免费学

大厂实战课仅对VIP开放

你的一对一导师

每月可免费咨询大牛30次

领取更多软件工程师实用特权

入驻

Angular 浏览器支持

原创
05/13 14:22 更新

浏览器支持

Angular 支持大多数常用浏览器,包括下列版本:

浏览器 支持的版本
Chrome 最新
Firefox 最新版以及扩展支持版本 (ESR)
Edge 最近的两个主版本
Safari 最近的两个主版本
iOS 最近的两个主版本
Android 最近的两个主版本

Angular 在持续集成过程中,对每一个提交都会使用 Sauce Labs 在上述所有浏览器上执行单元测试。

腻子脚本 (polyfill)

Angular 构建于 Web 平台的最新标准之上。要支持这么多浏览器是一个不小的挑战,因为它们不支持现代浏览器的所有特性。你可以通过加载腻子脚本(“polyfills”)来为想要支持的浏览器弥补这些特性。下面讲解了如何将腻子脚本包含到你的项目中。

这些建议的腻子脚本是运行完整 Angular 应用所需的。 你可能还会需要另一些的腻子脚本来支持没有出现在此列表中的哪些特性。

注意:
这些腻子脚本并没有神奇的魔力来把老旧、慢速的浏览器变成现代、快速的浏览器。

在 CLI 项目中启用腻子脚本

Angular CLI​ 提供了对腻子脚本的支持。

使用 ​ng new​ 命令创建项目时,会在项目文件夹中创建一个 ​src/polyfills.ts​ 配置文件。该文件包含许多强制性和可选腻子脚本的 JavaScript ​import ​语句。

  • 使用 ​ng new​ 创建项目时,会自动为你安装一些强制性腻子脚本(比如 ​zone.js​),并且它对应的 ​import ​语句已在 ​src/polyfills.ts​ 配置文件中启用。
  • 如果你需要一个可选的填充库,就必须安装它们的 npm 包,然后在 ​src/polyfills.ts​ 文件中反注释或创建一个对应的导入语句。

非 CLI 的用户的腻子脚本

如果你不使用 CLI,就要直接把腻子脚本添加到宿主页(​index.html​)中,就像这样:

比如:

<!-- pre-zone polyfills -->
<script src="node_modules/core-js/client/shim.min.js"></script>
<script>
  /**
   * you can configure some zone flags which can disable zone interception for some
   * asynchronous activities to improve startup performance - use these options only
   * if you know what you are doing as it could result in hard to trace down bugs.
   */
  // __Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
  // __Zone_disable_on_property = true; // disable patch onProperty such as onclick
  // __zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
  /*
   * in Edge developer tools, the addEventListener will also be wrapped by zone.js
   * with the following flag, it will bypass `zone.js` patch for Edge.
   */
  // __Zone_enable_cross_context_check = true;
</script>
<!-- zone.js required by Angular -->
<script src="node_modules/zone.js/bundles/zone.umd.js"></script>
<!-- application polyfills -->
综合评分:9.9 评分 请对本文进行纠错,及学习过程中有困难疑惑可在此进行讨论