Angular 在 prod 和 dev 构建中都不能在 IE 11 中工作

Question

我最近将我的全局 angular-cli 版本更新为 8。现在在 prod 模式下构建我的项目后，它在 IE11 中抛出错误。在 chrome 中它的工作正常。

对于 prod 版本错误显示为：

我尝试在本地检查相同的内容，并且本地开发环境中也存在问题。

这是 vendor.js 文件中抛出错误的行

const isPresent = (value) => value !== null && value !== undefined;

我的 package.json：

{
  "name": "edmw-project",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve --port 4300 --proxy-config proxy.conf.json",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "compodoc": "npx compodoc -p src/tsconfig.app.json"
  },
  "private": true,
  "dependencies": {
    "@angular-devkit/build-angular": "^0.13.0",
    "@angular-redux/store": "^9.0.0",
    "@angular/animations": "^6.0.9",
    "@angular/cdk": "^7.3.7",
    "@angular/common": "^6.0.9",
    "@angular/compiler": "^6.0.9",
    "@angular/core": "^6.0.9",
    "@angular/forms": "^6.0.9",
    "@angular/http": "^6.0.9",
    "@angular/platform-browser": "^6.0.9",
    "@angular/platform-browser-dynamic": "^6.0.9",
    "@angular/platform-server": "^6.0.9",
    "@angular/router": "^6.0.9",
    "@progress/kendo-angular-buttons": "^4.4.2",
    "@progress/kendo-angular-charts": "^3.3.2",
    "@progress/kendo-angular-common": "^1.1.4",
    "@progress/kendo-angular-dateinputs": "^3.4.4",
    "@progress/kendo-angular-dialog": "^3.6.2",
    "@progress/kendo-angular-dropdowns": "^3.5.3",
    "@progress/kendo-angular-excel-export": "^2.1.1",
    "@progress/kendo-angular-grid": "^3.6.0",
    "@progress/kendo-angular-inputs": "^3.2.0",
    "@progress/kendo-angular-intl": "^1.4.1",
    "@progress/kendo-angular-l10n": "^1.1.0",
    "@progress/kendo-angular-layout": "^3.1.2",
    "@progress/kendo-angular-notification": "^1.0.0",
    "@progress/kendo-angular-popup": "^2.6.0",
    "@progress/kendo-angular-toolbar": "^2.2.0",
    "@progress/kendo-charts": "^1.11.2",
    "@progress/kendo-data-query": "^1.5.0",
    "@progress/kendo-drawing": "^1.5.7",
    "@progress/kendo-theme-default": "latest",
    "@progress/kendo-ui": "^2018.2.530",
    "angular": "^1.7.9",
    "angular-webstorage-service": "^1.0.2",
    "bootstrap": "^4.1.3",
    "classlist.js": "^1.1.20150312",
    "core-js": "^2.5.7",
    "font-awesome": "^4.7.0",
    "hammerjs": "^2.0.0",
    "html2canvas": "^1.0.0-rc.1",
    "intl": "^1.2.5",
    "jquery": "1.11.1",
    "jquery-ui": "1.12.1",
    "ngx-scrollbar": "^2.2.0",
    "redux": "^4.0.1",
    "rxjs": "^6.2.2",
    "rxjs-compat": "^6.0.0",
    "underscore": "1.8.3",
    "upgrade-angular": "^0.1.3",
    "web-animations-js": "^2.3.1",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular/cli": "^6.2.5",
    "@angular/compiler-cli": "^6.0.9",
    "@angular/language-service": "^4.4.7",
    "@types/gridstack": "0.0.39",
    "@types/jasmine": "^2.8.8",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "^10.5.2",
    "@types/underscore": "1.8.9",
    "codelyzer": "^4.4.2",
    "jasmine-core": "^3.1.0",
    "jasmine-spec-reporter": "^4.2.1",
    "karma": "^2.0.5",
    "karma-chrome-launcher": "^2.2.0",
    "karma-cli": "^1.0.1",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "^2.0.0",
    "karma-jasmine-html-reporter": "^1.2.0",
    "protractor": "^5.4.0",
    "rxjs-tslint": "^0.1.5",
    "ts-node": "~3.2.0",
    "tslint": "^5.11.0",
    "typescript": "^2.7.2",
    "webpack": "^4.16.1"
  }
}

我的 polyfills.ts

/**
 * This file includes polyfills needed by Angular and is loaded before the app.
 * You can add your own extra polyfills to this file.
 *
 * This file is divided into 2 sections:
 *   1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
 *   2. Application imports. Files imported after ZoneJS that should be loaded before your main
 *      file.
 *
 * The current setup is for so-called "evergreen" browsers; the last versions of browsers that
 * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
 * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
 *
 * Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html
 */

/***************************************************************************************************
 * BROWSER POLYFILLS
 */

/** 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`.

/** Evergreen browsers require these. **/
import 'core-js/es6/reflect';
import 'core-js/es7/reflect';


/**
 * Required to support Web Animations `@angular/animation`.
 * Needed for: All but Chrome, Firefox and Opera. http://caniuse.com/#feat=web-animation
 **/
import 'web-animations-js';  // Run `npm install --save web-animations-js`.



/***************************************************************************************************
 * Zone JS is required by Angular itself.
 */
import 'zone.js/dist/zone';  // Included with Angular CLI.



/***************************************************************************************************
 * APPLICATION IMPORTS
 */

/**
 * Date, currency, decimal and percent pipes.
 * Needed for: All but Chrome, Firefox, Edge, IE11 and Safari 10
 */
 //import 'intl';  // Run `npm install --save intl`.
/**
 * Need to import at least one locale-data with intl.
 */
 //import 'intl/locale-data/jsonp/en';

节点版本：v12.16.0 Angular Cli 版本：本地 -- 6.2.9 和全局 -- 8.3.25

任何帮助将不胜感激。 谢谢

Answer 1

我认为这可能是因为使用全局版本的 cli 来构建应用程序。除了用于创建的版本之外，您不应使用不同版本的 cli 来构建 Angular 应用程序。尝试使用项目路径中的以下命令构建应用程序。

cd project_folder    
npm run build

所以这将使用本地 angular cli，即 "@angular/cli": "^6.2.5" 而不是全局版本。

使用以下命令进行产品构建

npm run build -- --prod --base-href=/AngularModules/

直接从命令 promt 使用 ng 命令将始终使用全局版本，而不是本地安装的版本。因此，使用 npm 脚本将始终确保我们将使用本地版本。