IE 11 在推荐修复后未加载 Angular 10 个应用

IE 11 not loading Angular 10 app after recommended fixes

我已经对 Angular 10 个应用程序的 IE11 问题进行了标准修复(未加载字体,捆绑文件中某些字符的脚本错误)——通过添加 tsconfig -es5.app.json 文件,目标为 es5,我在 es5 中添加了 es5 条目=]配置对象。 polyfills.ts 正在导入 classlist.js 文件。我没有遗漏任何东西。这是我的 package.json 文件,其中包含我使用的构建和 运行 脚本:

你可以看到 dev:es5dev:internal:es5 的配置都是 es5。现在这是我的 angular.json 文件构建配置:

"build": {
                "builder": "@angular-devkit/build-angular:browser",
                "options": {
                    "aot": true,
                    "outputPath": "dist/{MyContent}/",
                    "index": "src/index.html",
                    "main": "src/main.ts",
                    "polyfills": "src/polyfills.ts",
                    "tsConfig": "tsconfig.app.json",
                    "assets": ["src/favicon.ico", "src/assets"],
                    "styles": ["src/styles.scss"],
                    "scripts": []
                },
                "configurations": {
                    "production": {
                        "fileReplacements": [
                            {
                                "replace": "{myEnvDevFile}",
                                "with": "{myEnvProdFile}                               }
                        ],
                        "optimization": true,
                        "outputHashing": "none",
                        "sourceMap": false,
                        "extractCss": true,
                        "namedChunks": false,
                        "aot": true,
                        "extractLicenses": true,
                        "vendorChunk": false,
                        "buildOptimizer": true,
                        "budgets": [
                            {
                                "type": "initial",
                                "maximumWarning": "2mb",
                                "maximumError": "5mb"
                            },
                            {
                                "type": "anyComponentStyle",
                                "maximumWarning": "6kb"
                            }
                        ]
                    },
                    "es5": {
                        "budgets": [
                            {
                                "type": "anyComponentStyle",
                                "maximumWarning": "6kb"
                            }
                        ],
                        "tsConfig": "./tsconfig-es5.app.json"
                    }
                }
            }

这是我的原始 tsconfig.app.json 文件:

 {
       "extends": "./tsconfig.base.json",
        "compilerOptions": {
        "outDir": "./out-tsc/app",
       "types": []
   },
   "files": ["src/main.ts", "src/polyfills.ts"],
   "include": ["src/**/*.d.ts"]
  }

最后 tsconfig-es5.app.json 文件:

{
    "extends": "./tsconfig.app.json",
    "compilerOptions": {
      "target": "es5"
    }
}

我认为我没有遗漏任何东西。 Angular CLI 是 10,所以我觉得我很好。我犯了一个明显的错误吗?

对我来说,我一定是在 polyfill.ts 中遗漏了一个 polyfill,但我不知道是哪个。 zone.js 和 classlist.js 都被导入。

请按照以下步骤在 IE11 中 运行 Angular 10 应用程序。

第 1 步 :: 选中此 URL (medium.com) 并按说明进行操作。如果你很幸运,那么你的应用程序将在 IE11 上运行,如果不是,请按照第 2 步进行操作。

第 2 步 :: 您可能会在终端中遇到以下错误 -

ERROR in ./src/polyfills.ts
Module not found: Error: Can't resolve 'core-js/es6/reflect' in '...\src'

然后你必须注释掉 import 'core-js/es6/reflect' 并在 polyfills.ts -

中添加以下代码
/** Evergreen browsers require these. */
// import 'core-js/es6/reflect';

/** IE9, IE10 and IE11 requires all of the following polyfills. */
import 'core-js/es/reflect';
import 'core-js/es/symbol';
import 'core-js/es/object';
import 'core-js/es/array';
import 'core-js/es/function';
import 'core-js/es/parse-int';
import 'core-js/es/parse-float';
import 'core-js/es/number';
import 'core-js/es/math';
import 'core-js/es/string';
import 'core-js/es/date';
import 'core-js/es/regexp';
import 'core-js/es/map';
import 'core-js/es/set';

第 2 步参考 URL -