VUe Eelement-ui 兼容es6 兼容IE9+ 报错:SCRIPT1003: 缺少 ':’

7,280 阅读1分钟
目前
解决
方案:

1
、把
es6
改成兼容
浏览器的语法
ES5,
所有
js的转换

2、引入babel-polyfill

3、使用ESLint 语法规则,但是项目语法

基本上要
全部重新
改写


正确方法:下载依赖:babel-polyfill

(1)、安装依赖:

npm install --save babel-polyfill

(2)

如果你的英文入口使用ES6 import 语法,你应该在入口的开头替代导入垫片,以保证他是最先加载的js;

import 'babel-polyfill'

或在webpack中引入 ---- webpack.base.conf.js

module.exports = {
    entry: ["babel-polyfill","./app/js"]
}

<-官方写法

module.exports = {
  entry: {
    app: ['babel-polyfill', './src/main.js']
  },
}

<-my project写法


如若没有解决:IE 9+依然报错:SCRIPT1003: 缺少 ':

在自己项目中打包:
运行
npm run build 是否
有错;

错误

此错误是

发现是UglifyJs无法解析ES6的问题,而在1.4.2 element-ui的包估计有ES6的语法,所以才导致打包失败

解决:
webpak.base.conf.js

添加:
resolve('/node_modules/_element-ui@1.4.3@element-ui/src'),resolve('/node_modules/_element-ui@1.4.3@element-ui/packages')

{
  test: /\.js$/,
  loader: 'babel-loader',
  include: [resolve('src'), resolve('test'),resolve('/node_modules/_element-ui@1.4.3@element-ui/src'),resolve('/node_modules/_element-ui@1.4.3@element-ui/packages'),]
},

注意
_element-ui@1.4.3@element-ui
根据
自己项目的版本和文件名修改