ES6兼容ie9, flex兼容ie9

vue兼容ES6

在 ie9 的環境上，es6 的部分新對象、表達式，並不支持，解決方案是使用 babel-polyfill 組件，它可以將 es6 的代碼翻譯成低版本瀏覽器可以識別的 es5 代碼

npm install  babel-polyfill  --save

 

安裝完成后，在項目的主入口文件 main.js 的首行就可以直接引用： import 'babel-polyfill';

 

或者 在webpack.base.conf.js中的entry中添加一項

entry: {

    app: [ 'babel-polyfill', './src/main.js']

  },

 

//以上參考來源：https://juejin.im/post/5b2868b46fb9a00e6f65f87e

 

flex兼容ie9

條件性注釋：參考https://blog.csdn.net/a460550542/article/details/73521850

此處使用js判斷window.navigator.userAgent是否含有MSIE 或 Trident，識別是不是ie瀏覽器，然后判斷MSIE 的版本號判斷ie瀏覽器的版本, 如果<=9就在html 添加樣式lte-ie9，以后需要重寫樣式的地方，就在樣式前面加.lte-ie9, 優先級高於沒有加之前

ie11:"Mozilla/5.0 (Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729; rv:11.0) like Gecko"
ie10:"Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729)"
ie09:"Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 10.0; WOW64; Trident/7.0; .NET4.0C; .NET4.0E; .NET CLR 2.0.50727; .NET CLR 3.0.30729; .NET CLR 3.5.30729)"

　　

export function isLteIE9() {
  var ms_ie = false;
  var ua = window.navigator.userAgent;
  var old_ie = ua.indexOf('MSIE ');
  var new_ie = ua.indexOf('Trident/');

  if ((old_ie > -1) || (new_ie > -1)) {
    ms_ie = true;
  }

  if (ms_ie) {
    var reIE = new RegExp("MSIE (\\d+\\.\\d+);");
    reIE.test(ua);
    var fIEVersion = parseFloat(RegExp["$1"]);
    if (fIEVersion <= 9) {
      document.documentElement.className += " lte-ie9";
      return true
    }
  }
  return false
}