Vue+webpack IE11兼容性问题

打开IE11空白页,存在兼容性问题,发现是IE无法转ES6转为ES5

  • 一般在webpack.base.conf.js加入以下代码
entry: {
        app: ["babel-polyfill", "./src/main.js"]
  },

实在不行再在main.js导入

import 'babel-polyfill'//兼容IE11

运行发现还是不行报错,这个时候就是使用了elementui(我就是使用了),那么因为elementui 底层源码也是使用了es6语法,那么要加一下代码进行转译
网上解释 在 UglifyJs 的 github issues #78 找到了这样一个解决方案:由于 UglifyJs 只支持 ES5 而 element-ui 可能引入了一部分 ES6 的写法,所以导致 webpack 打包失败。issue 里最后给出的解决方案是用 beta 版本的Uglify-es 来代替 UglifyJs(Beta 版本引入了对 ES2015+)的支持。需要在前端工作目录下用执行命令 npm i -D uglifyjs-webpack-plugin@beta。
不过在尝试过后,发现 build error 的问题依然没有解决,在深入查找问题所在后,决定用 bable 来解析 element-ui, 要完成此操作只需要修改前端文件夹下的build/webpack.base.conf.js 文件即可

再次修改如下:

 {
        test: /\.js$/,
        loader: 'babel-loader',
        include: [resolve('src'), resolve('test'),resolve('/node_modules/element-ui/src'),resolve('/node_modules/element-ui/packages')]
      },
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1 Webpack 1.1 概念简介 1.1.1 WebPack是什么 1、一个打包工具 2、一个模块加载工具 3...
    Kevin_Junbaozi阅读 11,746评论 0 16
  • 前言 已经有很多分析Vue-cli搭建工程的文章,为什么自己还要写一遍呢。学习就好比是座大山,人们沿着不同的路登山...
    若川i阅读 7,222评论 0 7
  • HTC vive设备结合unity开发手柄转动阀门功能 现在需求是:使用手柄握住一个阀门,进行旋转。 如下图: 所...
    TomasW阅读 4,048评论 1 1
  • 吆喝着卖馍的伙计 城墙根下的剃头匠 路上女娃们野得很 拧着褂子的粘面郎 汉子在门前插着腰 对我说:碎娃你能chua...
    e1c4bbf24f9a阅读 1,163评论 0 0
  • 《西游记》是我国四大名著之一,其内容博大精深,就像鲁迅先生所说的那样:“《西游记》讽刺揶揄则取当时世态,加以铺张描...
    月未落阅读 4,373评论 0 1