【VUE实践项目干货】如何兼容IE

Vue项目IE11兼容

常见问题：

1. 控制台报错SCRIPT1002:语法错误或STRICT错误，点击下部文件（常见：main.js，chunk-vendor.js）进行查看，断点下部拥有依赖包关键字，查找是否有常见IE不支持依赖包。

*常见IE不支持依赖包

"browser-md5-file": "^1.1.1",//可以换成引入spark-md5.js包

"quill-image-drop-module": "^1.0.3", //如无使用可去掉

 

兼容IE10常用依赖vue-quill-editor存在问题，如未使用建议删除，相关依赖quill-image-resize-module一并删除

 

 

1. 如无上述问题报SCRIPT1002可尝试解决方式在dependencies项目启动依赖包中引入："babel-plugin-import": "^1.13.0",

在devDependencies开发依赖包中引入：

"babel-plugin-component":"^1.1.1",

"babel-plugin-syntax-dynamic-import": "^6.18.0",

"babel-preset-stage-1": "^6.24.1",

在babel.config.js中加入：

module.exports = {

    "presets": [

        [

            '@vue/app',

            {

                "modules": false,

                "useBuiltIns": "entry"

            }

        ],

    ]

}

在vue.config.js中加入：

const path = require('path')

function resolve (dir) {

    return path.join(__dirname, dir)

}

chainWebpack: (config) =>{

        //命名

        config.resolve.alias.set('@', resolve('src'))

        config

            .entry('./src/main.js')

            .add('babel-polyfill')

        // .set('jquery',path.resolve(__dirname,'./public/jquery-1.10.1.min.js'))

    }

 

1. 当出现单点登录进入页面登录信息未带出的情况可在axios的filter加如下代码：

axios.defaults.headers.get['Cache-Control'] = 'no-cache';

 

1. 当持续报错sockjs:打开node_module -> sockjs_client -> dist -> sockjs.js注释sockjs.js中的1606行注释://self.xhr.send(payload)

 

1. Ie兼容必备，检查框架一般带有的代码：

1)Index.html中：<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>

2)依赖：babel-polyfill

3)package.json中browserslist