vue遇到ie兼容问题如何处理_Vue 2.0 解决IE浏览器的兼容性

尽管一些高级浏览器对用 babel 编译后的 Vue 2.0 项目支持得很好，但是 IE 浏览器却还是有所欠缺，本文介绍如何解决 IE11 的兼容性(低版本的IE就忽略吧)。

1. 让IE11支持Vue2.0的语法

npm 安装 babel-polyfill

npm install --save-dev babel-polyfill

在 webpack.base.conf.js 文件中修改 entry，添加 babel-polyfill ：

// 修改前

module.exports = {

context: path.resolve(__dirname, '../'),

entry: {

app: './src/main.js',

}

...

// 修改后

module.exports = {

context: path.resolve(__dirname, '../'),

entry: {

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

}

...

然后在 main.js 入口文件第一行引入 babel-polyfill：

import "babel-polyfill"

2. 让IE11支持Vue-router跳转功能

在IE11上无法用router-link跳转，主要是当url的hash change的时候浏览器没有做出响应。下面的代码里面做了一个兼容，直接添加在 main.js 入口文件的最后即可！

if (

'-ms-scroll-limit' in document.documentElement.style &&

'-ms-ime-align' in document.documentElement.style

) { // detect it's IE11

window.addEventListener("hashchange", function(event) {

var currentPath = window.location.hash.slice(1);

if (store.state.route.path !== currentPath) {

router.push(currentPath)

}

}, false)

}

vue遇到ie兼容问题如何处理_Vue 2.0 解决IE浏览器的兼容性相关推荐

vue遇到ie兼容问题如何处理_vue 兼容IE报错解决方案
IE 页面空白报错信息此时页面一片空白报错原因 Babel 默认只转换新的 JavaScript 语法(如箭头函数),而不转换新的 API ,比如 Iterator.Generator.Set. ...
vue遇到ie兼容问题如何处理_vue IE兼容性问题汇总
1.ES6语法不支持解决方法: 引入babel-polyfill npm install --save bable-polyfill webpack.base.conf.js中修改为 app: [' ...
vue遇到ie兼容问题如何处理_详解vue 兼容IE报错解决方案
IE 页面空白报错信息此时页面一片空白报错原因 Babel 默认只转换新的 JavaScript 语法(如箭头函数),而不转换新的 API ,比如 Iterator.Generator.Set. ...
vue遇到ie兼容问题如何处理_静电喷涂设备遇到紧急事故应该如何处理
静电喷涂设备现在市场使用率越来越广泛,但是很多消费者却不知道喷涂设备遇到紧急事件的处理方法,下面卓越涂装的小编为大家介绍喷涂设备在遇到紧急事项的处理方法. 1.静电粉末喷涂电气阻扰事变可能出现较多,其 ...
vue 获取当前发布的版本_Vue 3.0重磅发布！
来源:OSC开源社区(ID:oschina2013) Vue.js 3.0 "One Piece" 已正式发布,此框架新的主要版本提供了更好的性能.更小的捆绑包体积.更好的 Typ ...
浏览器兼容css hack,CSS Hack技术解决多浏览器兼容问题
本文向大家描述一下如何使用CSS Hack技巧解决DIV+CSS布局多浏览器兼容问题,针对不同的浏览器写不同的CSS代码的过程,就叫CSS Hack,相信本文介绍一定会让你有所收获. CSS Hack ...
win10不兼容中文版的vc++ 6.0解决办法
转载自原博主:https://blog.csdn.net/w_9449/article/details/52864135 无法正常运行原因就是win10不兼容中文版的vc,解决方法就是一句话,用英文版 ...
开发网站时解决360浏览器的兼容性问题，兼容模式打不开，让网页默认为极速模式打开
360浏览器打开网页默认是兼容模式,导致有些网页打不开, 可以在网页头部加上代码,默认改为为极速模式打开,就正常了: <meta http-equiv="X-UA-Compatible ...
解决360浏览器兼容性问题的极速模式、兼容模式、IE11模式对同一页面的不同兼容性问题
刚开始写页面的时候,会出现很多问题,当然兼容性问题是最不容忽视的.然而就在刚刚我写代码的时候,在谷歌运行的很好的代码,突然转到360的三种模式的时候,就出现了各种问题.然而我也各种找解决办法,终于还是 ...
从 ie10浏览器下Symbol 未定义的问题探索vue项目如何兼容ie低版本浏览器（ie9, ie10, ie 11 ）
1. 问题: vue项目在ie11下一片空白并报Symbol 未定义的错原因: ie10浏览器解析不了es6的语法,需要我们使用babel(Babel是一种工具链,主要用于将EC ...

vue遇到ie兼容问题如何处理_Vue 2.0 解决IE浏览器的兼容性

vue遇到ie兼容问题如何处理_Vue 2.0 解决IE浏览器的兼容性相关推荐

最新文章

热门文章