vue项目遇到的兼容性问题解决（IE）
vue项⽬遇到的兼容性问题解决（IE）
记录⼀下之前项⽬所遇到的兼容性问题
项⽬⽤的是https协议 前端⽤的是Vue全家桶+elementUI框架搭成
问题⼀：之前项⽬只能在chrome上正常使⽤在⽕狐 IE浏览器上显⽰空⽩⽕狐直接阻拦了跨域请求
了半天原因，⽕狐浏览器是不能跨域请求的 会直接拦截请求操作，所以我就设置了proxy代理，这只是解决开发环境上的跨域问题，⽣产环境上还需要设置nginx代理（⽬前还没做到Nginx这⾥，后续做了再做详细的记录）
// 修改config/index.js 设置代理
proxyTable:{
"/api":{
cplasftarget:"xxxx",//设置你调⽤的接⼝域名和端⼝号
changeOrigin:true,//跨域
secure:false//wepack默认http协议，如果要代理https协议，需要增加ecure: false
升学宴祝福语// pathRewrite: {
//  "^/api": "/"
// }
}
},
好习惯作文
问题⼆：IE11 不⽀持promise
中国文化传统
需要将promise转换为浏览器可识别的ES5语法
// 1.安abel-polyfill
npm install --save-dev babel-polyfill
// 2.在main.js中引⼊babel-polyfill
import'babel-polyfill'
// 3.或者修改build/f.js⽂件
//将
entry:{
app:'./src/main.js'
},
//替换为
entry:{
app:['babel-polyfill','./src/main.js']
},
国产奶粉排行榜前10名问题三：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/f.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;

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。