• angular 8.x IE11上兼容运行


    1.首先angular.json修改为

    "architect": {
            "build": {
              "builder": "@angular-devkit/build-angular:browser",
              "options": {
                ...
                "es5BrowserSupport": true // 新增
              },
              "configurations": {
                ...
                "es5": {
                  "tsConfig": "./tsconfig-es5.app.json" // 新增
                }
              }
            },
            "serve": {
                ...
                "es5": {
                  "browserTarget": "app:build:es5" // 新增
                }
              }
            }

    2.修改tisconfig,将

    target:“es2015”修改为
    target:'es5'

    3.polyfill.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/guide/browser-support
     */
    
    /***************************************************************************************************
     * BROWSER POLYFILLS
     */
    
    /** IE10 and IE11 requires the following for NgClass support on SVG elements */
    import 'classlist.js';  // Run `npm install --save classlist.js`.
    
    /**
     * Web Animations `@angular/platform-browser/animations`
     * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari.
     * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0).
     */
    import 'web-animations-js';  // Run `npm install --save web-animations-js`.
    
    /**
     * By default, zone.js will patch all possible macroTask and DomEvents
     * user can disable parts of macroTask/DomEvents patch by setting following flags
     * because those flags need to be set before `zone.js` being loaded, and webpack
     * will put import in the top of bundle, so user need to create a separate file
     * in this directory (for example: zone-flags.ts), and put the following flags
     * into that file, and then add the following code before importing zone.js.
     * import './zone-flags.ts';
     *
     * The flags allowed in zone-flags.ts are listed here.
     *
     * The following flags will work for all browsers.
     *
     * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
     * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
     * (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
     *
     *  in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
     *  with the following flag, it will bypass `zone.js` patch for IE/Edge
     *
     *  (window as any).__Zone_enable_cross_context_check = true;
     *
     */
    (function () {
      Object.setPrototypeOf = Object.setPrototypeOf || ({ __proto__: [] } instanceof Array ? setProtoOf : mixinProperties);
    
      function setProtoOf(obj, proto) {
        obj.__proto__ = proto;
        return obj;
      }
    
      function mixinProperties(obj, proto) {
        for (const prop in proto) {
          if (!obj.hasOwnProperty(prop)) {
            obj[prop] = proto[prop];
          }
        }
        return obj;
      }
    })();
    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';
    
    
    /** Evergreen browsers require these. **/
    // Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove.
    import 'core-js/es7/reflect';
    
    
    /**
     * Required to support Web Animations `@angular/platform-browser/animations`.
     * 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 default for Angular itself.
     */
    import 'zone.js/dist/zone';  // Included with Angular CLI.
    import 'babel-polyfill';
    
    /***************************************************************************************************
     * APPLICATION IMPORTS
     */
    View Code

    4.browsersList.ts

    not IE 9-11 # For IE 9-11 support, remove 'not'.
    修改为
    IE 9-11 # For IE 9-11 support, remove 'not'.

    重新运行项目。

  • 相关阅读:
    Using join buffer (Block Nested Loop)调优
    训练日志
    threejs对象控制
    js保留4位小数
    batchsize 为4时,显卡使用效率
    QMatrix4x4
    QHostInfo
    yolov5训练表示识别模型日志记录
    yolov5 train log
    yolov5模型训练过程中显卡使用率查询——记录
  • 原文地址:https://www.cnblogs.com/huangmin1992/p/12090138.html
Copyright © 2020-2023  润新知