vue项目遇到的兼容性问题解决（IE）

记录一下之前项目所遇到的兼容性问题
项目用的是https协议 前端用的是Vue全家桶+elementUI框架搭成

问题一：之前项目只能在chrome上正常使用 在火狐 IE浏览器上显示空白 火狐直接阻拦了跨域请求

找了半天原因，火狐浏览器是不能跨域请求的 会直接拦截请求操作，所以我就设置了proxy代理，这只是解决开发环境上的跨域问题，生产环境上还需要设置nginx代理（目前还没做到Nginx这里，后续做了再做详细的记录）

// 修改config/index.js 设置代理
proxyTable: {
      "/api": {
        target: "https://xxxx", //设置你调用的接口域名和端口号
        changeOrigin: true, //跨域
        secure: false //wepack默认http协议，如果要代理https协议，需要增加ecure: false
        // pathRewrite: {
        //   "^/api": "/"
        // }
      }
    },

问题二：IE11 不支持promise

需要将promise转换为浏览器可识别的ES5语法

// 1.安装babel-polyfill
npm install --save-dev babel-polyfill
// 2.在main.js中引入babel-polyfill
 import 'babel-polyfill' 
// 3.或者修改build/webpack.base.conf.js文件
//将
entry: {
 app: './src/main.js'
},
//替换为
entry: {
 app: ['babel-polyfill', './src/main.js']
},

问题三：IE浏览器以及edge浏览器的不支持es6里面promise的finally

//解决方法：
//1.安装 axios promise.prototype.finally
npm install axios promise.prototype.finally --save
//2.在项目main.js里面引入依赖require('promise.prototype.finally').shim()

问题四：IE11 中app.js报语法错误 或者缺少‘：’ ‘（’等

是因为这些文件里面还存在ES6语法 需要转换
首先点击报错地点 复制报错地点上方的文件地址 如：./node_modules/_vue-particles@1.0.9@vue-particles/src/vue-particles/index.js

 // 修改build/webpack.base.conf.js文件
{
        test: /\.js$/,
        loader: "babel-loader",
        include: [
		// 把这个文件添加进去 让他进行babel编译
          resolve(
            "node_modules/_vue-particles@1.0.9@vue-particles/src/vue-particles"
          ),
          resolve("src"),
          resolve("test"),
          resolve("node_modules/webpack-dev-server/client")
        ]
      },

问题五：ie11打不开vue项目，报错 “对象不支持“addEventListener”属性或方法”

在head标签中加入< meta http-equiv=“X-UA-Compatible” content=“IE=EDGE”/>
这个属性主要是设置浏览器优先使用什么模式来渲染页面的。代码IE=edge告诉IE使用最新的引擎渲染网页,这个在需要兼容IE浏览器的情况下都可以加上这句话

问题六：IE 11 flex:1;样式会出错，跟实际想要的效果不同

因为IE11 flex:1;会识别为flex:1 1 0;而其他浏览器是flex:1 1 auto;
所以改为width:100%;flex:1 1 auto; 或width:100%;flex-grow:1;