使用背景

因为做的项目会在IE环境下运行的情况,按正常vue支持来说,IE8+应该是支持的,可是ES6写法需要进行兼容,否则项目在IE中无法打开,空白,也报一些 未定义什么的错误。
在这里插入图片描述
这时候就需要兼容ie,将es6转为es5后使用

1、安装依赖

npm install babel-polyfill es6-promise -s

2、在main.js首行引入

import 'babel-polyfill'
import promise from 'es6-promise'
promise.polyfill()

3、在babel.config.js修改presets,内容如下:

presets: [
    [
      '@vue/app',
      {
        useBuiltIns: 'entry',
        polyfills: ['es6.promise', 'es6.symbol']
      }
    ]
  ],

4、在package.json最后加上;或者.browserslistrc文件not内容改为ie<10

"browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie<10"
  ]

5、在vue.config.js中添加配置

在module.exports 外面加上


```javascript
var path = require('path')
function resolve (dir) {
    return path.join(__dirname, '..', dir)
}

在module.exports 里面加入配置

transpileDependencies: [
        /node_modules/
],    
chainWebpack(config){
        config.entry.app = ["babel-polyfill","./src/main.js"];
        config.module.rule('compile')
        .test(/\.js$/)
        .include
        .add(resolve('src'))
        .add(resolve('test'))
        .add(resolve('node_modules/webpack-dev-server/client'))
        .add(resolve('node_modules'))
        .end()
        .use('babel')
        .loader('babel-loader')
        .options({
            presets:[
                ['@babel/preset-env',{
                    modules:false
                }]
            ]
        })
   },

备注:如果使用了sockjs-client,需要将sockjs-client 降级安装 npm i sockjs-client@1.5.1 -D

Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐