IE11中vue.js、webpack和babel的语法错误

Question

我试图让一个演示开始工作，它在Chrome中运行得很好，但在IE11中却失败了。

语法错误与eval()相关，但仅是IE11的一个问题。这个问题的一个例子可以在这里看到(使用IE11查看)：

示例站点不在IE11中工作。 源头就在这里。

--我已经修改了.babelrc文件，使其类似于：

{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
      }
    }],
    "stage-2"
  ],
  "plugins": ["transform-runtime"],
  "env": {
    "test": {
      "presets": ["env", "stage-2"],
      "plugins": ["istanbul"]
    }
  }
}

我的webpack.base.conf.js文件已被更改为包含babel-polyfill，但似乎没有任何东西有助于解决这个问题。

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

任何建议都是非常感谢的。

Answer 1

我也有过类似的问题。在我的例子中，这是因为我在.vue：lang="coffee"中使用coffeescript。脚本没有被转换为ES5，所以我编辑了vue-loader.conf.js来传输coffeescript。

我是由vue-cli + vuejs-templates/webpack完成这个项目的

"build/utils.js“

exports.scriptLoaders = function (options) {
  options = options || {}

  const coffeeLoader = {
    loader: 'coffee-loader',
    options: {
      transpile: {
        presets: ['env', 'es2015']
      }
    }
  }

  const jsLoader = {
    loader: 'babel-loader'
  }

  return {
    js: jsLoader,
    coffee: coffeeLoader
  }
}

build/vue-loader.conjs“

module.exports = {
  loaders: Object.assign({},
    utils.cssLoaders({
      sourceMap: isProduction
        ? config.build.productionSourceMap
        : config.dev.cssSourceMap,
      extract: isProduction
    }),
    utils.scriptLoaders()),
  transformToRequire: {
    video: 'src',
    source: 'src',
    img: 'src',
    image: 'xlink:href'
  }
}

这是回购：https://github.com/wataruoguchi/play-vue-cli/commit/0bdb9badf82e60696adb393bc351c48a3e69072c

我最后没有用“巴贝尔-多填”。

Answer 2

IE不支持箭头函数，并且“语法错误”被记录为一行：

boolean: val => (typeof val === 'string' ? val === '' || val === 'true' ? true : (val === 'false' || val === 'null' || val === 'undefined' ? false : val) : val),

在供应商的档案里。