尽管Babel Polyfill仍无法在IE11中使用

Question

不幸的是，我需要最新的应用程序才能支持Internet Explorer11。这个要求令我有些惊讶，因此我已经使用Vue.js构建了应用程序前端。后端是用Laravel编写的，因此我使用laravel-mix / webpack。

这是我的app.js：

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

很明显，IE11不支持Vue.js，所以我尝试了以下方法来编译/填充代码。

1。需要polyfill

方法：如require("@babel/polyfill");]中所述，将app.js添加到我的https://babeljs.io/docs/en/babel-polyfill顶部>

结果

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

SCRIPT1003：'：'预期

显然是兼容性问题，因为在ES <5中，前置data(){}无效

2。使用mix.babel

方法：按照mix.babel(['resources/js/app.js'], 'resources/js/app.js')中的说明将webpack.mix.js添加到我的https://laravel.com/docs/5.8/mix中（我正在使用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');
结果

：与1中的错误消息相同

3。使用混合扩展名

方法：安装此扩展程序：https://laravel-mix.com/extensions/polyfill并按照说明配置我的webpack.mix.js。我的webpack.mix.js现在看起来像这样：

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手动转译

Approach：只是出于绝望，我试图使用以下命令app.js]来手动转换./node_modules/.bin/babel ./public/js/app.js --out-dir ./public/js/

结果：til幸，与1

中的错误相同

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

不幸的是，我需要最新的应用程序才能支持Internet Explorer11。这个要求令我有些惊讶，因此我已经使用Vue.js构建了应用程序前端。 ...

Answer 1

如果无法使用Babel-Polyfill，可以尝试使用Polyfill.io，如果浏览器需要，它会自动对选定的Polyfill进行填充。

[您需要做的就是进入Create a polyfill bundle页面，然后选择所需的polyfills。然后，制作好捆绑包后，将URL复制到顶部，并在<script>中添加带有所述URL的head标签。

[我个人还没有在Laravel上使用它，但是我以前曾与babel-polyfill进行过战斗，最终因为我无法使babel-polyfill正常工作而使用Polyfill.io。