Vue.js 尽管Babel Polyfill，但Vue在IE11中不工作

不幸的是，我最近的应用程序需要支持Internet Explorer 11。这个要求让我有些惊讶，所以我已经用Vue.js构建了应用程序前端。后端是用Laravel编写的，因此我使用Laravel mix/webpack

这是我的

app.js

：

require('./bootstrap');
window.Vue = require('vue');

显然，IE11不支持Vue.js，所以我尝试了以下传输/填充代码的方法

1.需要多填料 方法：添加

要求（“@babel/polyfill”）

到my

app.js

的顶部，如中所述

结果：IE控制台中显示以下错误消息：

脚本1003:“：”应为

显然是一个兼容性问题，因为pre

data（）{}

在ES<5中无效

2.使用mix.babel 方法：将

mix.babel（['resources/js/app.js']，'resources/js/app.js'）

添加到我的

webpack.mix.js

，如中所述（我使用的是laravel 5.8.36）。我的

webpack.mix.js

现在看起来像这样：

const mix = require('laravel-mix');
mix.js('resources/js/app.js', 'public/js/app.js')
mix.babel(['resources/js/app.js'], 'resources/js/app.js')
mix.sass('resources/sass/app.scss', 'public/css');

const mix = require('laravel-mix');
require('laravel-mix-polyfill');

mix.js('resources/js/app.js', 'public/js/app.js')
mix.sass('resources/sass/app.scss', 'public/css');
mix.polyfill({
    enabled: true,
    useBuiltIns: "usage",
    targets: {"firefox": "50", "ie": "11"}
})

结果：与1中的错误消息相同

3.使用混合扩展 方法：安装此扩展：并按说明配置我的

webpack.mix.js

。我的

webpack.mix.js

现在看起来像这样：

const mix = require('laravel-mix');
mix.js('resources/js/app.js', 'public/js/app.js')
mix.babel(['resources/js/app.js'], 'resources/js/app.js')
mix.sass('resources/sass/app.scss', 'public/css');

const mix = require('laravel-mix');
require('laravel-mix-polyfill');

mix.js('resources/js/app.js', 'public/js/app.js')
mix.sass('resources/sass/app.scss', 'public/css');
mix.polyfill({
    enabled: true,
    useBuiltIns: "usage",
    targets: {"firefox": "50", "ie": "11"}
})

结果：再次显示与1中相同的错误消息

4.使用babel cli手动传输 方法：出于绝望，我尝试使用以下命令手动传输我的

app.js

，命令为

/node\u modules/.bin/babel./public/js/app.js--out dir./public/js/

结果：仍然没有运气，与1中的错误相同

---

我真的开始感到沮丧，因此非常感谢任何帮助。

如果您无法让

Babel Polyfill

工作，您可以尝试使用，如果浏览器需要，它会自动填充选定的Polyfill

您只需转到页面，选择所需的多边形填充。然后，一旦您完成了捆绑，复制顶部的URL，并将带有所述URL的

标记添加到您的

头部

我个人没有在Laravel中使用过它，但我之前也曾与babel polyfill打过交道，最后使用了polyfill.io，因为我无法让babel polyfill正常工作。
我创建了一个捆绑包，包括ES2015-2019，并通过标签将其包括在内。脚本已加载，但错误仍然存在。是否删除了以前尝试的所有方法？可能是他们相互矛盾。如果你已经这样做了，也许多边形填充不是问题所在。是的，每当我尝试新方法时，我都会保留以前的方法。我也同意你的建议。你是否将polyfill脚本作为
中的第一个脚本？是的，我确实这样做了。你正在使用哪个版本的Vue.js？我创建了一个新的Vue示例（基于），并使用了默认预设（babel、eslint）。它似乎在IE浏览器中运行良好。结果，请检查一下。此外，您能否发布足够的代码来重现中的问题。此外，这里有一些关于在Vue.js中使用babel的相关文章，您可以查看它们：，