【问题标题】:Angular 9.x Application Doesn't Load in IE11Angular 9.x 应用程序无法在 IE11 中加载
【发布时间】:2020-12-01 10:49:40
【问题描述】:

最近我们发现 Internet Explorer(IE10、IE11)不再加载我们的 Angular v9.x 应用程序。几个月前它正在引导和加载应用程序,并通过守卫将使用 IE10 或 IE11 的用户重定向到不受支持的视图,提供有关如何升级到常青浏览器(Chrome、Edge、Firefox 等)的信息。

由于某种原因,最近它似乎没有引导应用程序,而是您只是无休止地盯着<app-root> 标签之间的徽标。使用 Windows 10 的 IE11 没有错误,所以我没有什么要调试的。

当涉及到此类问题时,我已经排除了常见的嫌疑人(见下文),并且还查看了 stackoverflow 中的多个帖子,例如 linklink,并引用了 linklink。我对没有错误感到困惑,好像 Angular 不存在,但我可以看到 JS 文件被拉下(runtime.js、polyfills.js、styles.js、scripts.js、vendor.js、和 main.js)。

  1. Polyfills
import 'classlist.js';
import 'web-animations-js';
import 'core-js';
  1. 浏览器列表
> 0.5%
last 2 versions
Firefox ESR
not dead
IE 9-11 # For IE 9-11 support, remove 'not'.
  1. ES5 tsconfig
{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "target": "es5"
  },
  "include": [
    "src/**/*.d.ts"
  ]
}
  1. 运行快速检查:

npx es-check es5 './dist/**/*es5*.js' './dist/**/scripts.*.js' --verbose

  1. 在本地运行生产构建文件并获得相同的结果:

cd ./dist/PROJEC_NAME && npx local-web-server

这是我讨厌问的问题之一,特别是因为它无处不在,但我花了很长时间试图弄清楚为什么我们的应用程序停止在 IE11 中运行,并且已经用尽了我的知识和研究。有人有什么建议吗?

【问题讨论】:

    标签: angular internet-explorer-11


    【解决方案1】:

    由于我们在技术上不支持 IE10 和 IE11,但我们试图阻止使用 IE10 和 IE11,我们决定采取更严格的方法并将内容拆分到位于 /assets 的静态 HTML 页面,该页面会被加载使用index.html 中的脚本检测不受支持的浏览器。这也意味着我们可以删除我们的 polyfill。

    【讨论】:

    • 一般情况下,只需要在tsconfig.json文件中设置`"target":"es5"`就会在IE浏览器中加载应用。如果您没有在应用程序中使用 polyfill,那么您可以避免导入它们。您可以保留其余设置,并尝试查看应用程序是否加载或显示一些错误。如果您已决定对问题使用上述解决方法,那么您可以尝试在 48 小时后标记您自己对此问题的答案,当它可以标记时。它可以在未来帮助其他社区成员解决类似的问题。感谢您的理解。
    • @Deepak-MSFT 我不确定您的评论有多大帮助。我已经在我的问题中概述的 es5 的 tsconfig 中设置了它,我知道我现在可以在没有 IE 的情况下删除 polyfill,这就是为什么它是我发布的答案的一部分,由于有等待2天。不过谢谢
    猜你喜欢
    • 1970-01-01
    • 2020-11-05
    • 2018-11-23
    • 1970-01-01
    • 1970-01-01
    • 2013-02-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多