Angular CLI 1.6.5生产环境下IE无法运行问题咨询

我来帮你一步步排查这个IE兼容问题——Angular 5+对IE的支持确实需要精准配置，尤其是生产AOT构建场景下，咱们从最常见的原因入手：

1. 确认Polyfills依赖与配置是否完整 #

你提到已经取消了polyfills.ts里所有注释，但要注意几个关键点：

• 确保已安装对应依赖：Angular 5需要core-js@2.x版本（core-js 3+不再支持IE），执行npm install core-js@2 --save；如果用到动画，还要安装web-animations-js：npm install web-animations-js --save。
• 检查polyfills.ts里的核心导入是否存在：

  // IE9, IE10 and IE11 requires all of the following polyfills.
  import 'core-js/es6/symbol';
  import 'core-js/es6/object';
  import 'core-js/es6/function';
  import 'core-js/es6/parse-int';
  import 'core-js/es6/parse-float';
  import 'core-js/es6/number';
  import 'core-js/es6/math';
  import 'core-js/es6/string';
  import 'core-js/es6/date';
  import 'core-js/es6/array';
  import 'core-js/es6/regexp';
  import 'core-js/es6/map';
  import 'core-js/es6/weak-map';
  import 'core-js/es6/set';
  
  // IE10 and IE11 requires the following for NgClass support on SVG elements
  import 'classlist.js';  // Run `npm install --save classlist.js`.
  
  // IE10 and IE11 requires the following for the Reflect API.
  import 'core-js/es6/reflect';
  
  // Web Animations `@angular/platform-browser/animations`
  import 'web-animations-js';  // Run `npm install --save web-animations-js`.
  
  // Zone JS is required by Angular itself.
  import 'zone.js/dist/zone';
  

2. 检查TypeScript配置（tsconfig.json/tsconfig.prod.json） #

生产构建的TypeScript配置必须确保编译目标是ES5，且包含必要的库：

• 在tsconfig.prod.json的compilerOptions里确认：

  "compilerOptions": {
    "target": "es5",
    "lib": ["es2015", "dom", "es2015.collection"],
    "module": "es2015",
    "moduleResolution": "node"
  }
  

  这里target: es5是关键——IE11无法识别ES6+语法，必须强制编译为ES5。

3. 调整Angular-CLI构建配置 #

Angular-CLI 1.6.5的--prod参数默认启用了buildOptimizer，但这个优化在Angular 5版本可能和IE兼容存在冲突，你可以尝试关闭它重新构建：

ng build -e=prod --prod --no-build-optimizer --no-sourcemap --aot

另外，检查你的.angular-cli.json配置，确保apps数组里的应用配置正确指向polyfills.ts：

"apps": [
  {
    "root": "src",
    "outDir": "dist",
    "assets": ["assets"],
    "index": "index.html",
    "main": "main.ts",
    "polyfills": "polyfills.ts",
    "test": "test.ts",
    "tsconfig": "tsconfig.app.json",
    "testTsconfig": "tsconfig.spec.json",
    "prefix": "app",
    "styles": ["styles.css"],
    "scripts": [],
    "environmentSource": "environments/environment.ts",
    "environments": {
      "dev": "environments/environment.ts",
      "prod": "environments/environment.prod.ts"
    }
  }
]

4. 查看IE控制台的具体错误 #

打开IE的开发者工具（按F12），切换到「控制台」标签，查看具体的报错信息——这是最精准的排查方式：

• 如果提示Symbol is undefined：说明core-js/es6/symbol未正确导入或依赖缺失；
• 如果提示Promise is undefined：检查core-js/es6/promise的导入；
• 如果是第三方库报错：确认该库是否提供ES5版本，或者在.angular-cli.json的scripts数组中引入其ES5版本文件。

5. 清除IE缓存 #

IE的缓存机制经常会导致部署新代码后仍加载旧资源，尝试按Ctrl+Shift+Delete清空缓存，再按Ctrl+F5强制刷新页面。

内容的提问来源于stack exchange，提问作者Gerben Kranenborg