如何正确设置多填充，使我的Vue.JS网站在Internet 11上工作？

Question

我有一个用Laravel和Vue.JS构建的项目(也使用Bootstrap)。在包括Edge在内的所有浏览器上，一切都正常工作。但正如你所猜到的，而不是在IE11。

我已经尝试过各种使用babel/Poly填充的配置。

在我的webpack.mix.js中，我有以下代码：

let mix = require('laravel-mix');

require('laravel-mix-polyfill');

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

我的package.json文件中有以下依赖项：

"devDependencies": {
        "@babel/polyfill": "^7.8.3",
        "axios": "^0.18.1",
        "bootstrap": "^4.3.1",
        "cross-env": "^5.1",
        "laravel-mix": "^4.0.7",
        "laravel-mix-polyfill": "^1.1.1",
        "lodash": "^4.17.5",
        "mutationobserver-shim": "^0.3.3",
        "node-sass": "^4.13.1",
        "popper.js": "^1.12",
        "portal-vue": "^2.1.4",
        "resolve-url-loader": "^2.3.1",
        "sass": "^1.15.2",
        "sass-loader": "^7.1.0",
        "vue": "^2.6.10",
        "vue-template-compiler": "^2.6.10"
    },
    "dependencies": {
        "@chenfengyuan/vue-qrcode": "^1.0.1",
        "bootstrap-vue": "^2.2.0",
        "current-device": "^0.9.1",
        "intersection-observer": "^0.7.0",
        "lottie-vuejs": "0.3.6",
        "moment": "^2.24.0",
        "v-mask": "^2.0.2",
        "vue-autosuggest": "1.8.3",
        "vue-js-toggle-button": "^1.3.3",
        "vue-recaptcha": "^1.2.0",
        "vue-social-sharing": "^2.4.7",
        "vue2-flip-countdown": "^0.9.3",
        "vuelidate": "^0.7.4"
    }

我的app.js文件的顶部是Bootstrap文档所推荐的：

import '@babel/polyfill'
import 'intersection-observer' // Optional

我也尝试在我的网站的头部分添加来自polyfill.io的脚本标签。

所有这些都会导致一个带有SCRIPT1002语法错误和SCRIPT5007对象预期错误的空白屏幕。我不知道我哪里出了问题，我真的需要让它为IE11工作。我的Vue组件在刀片文件中没有一个是自动关闭的，在这里回答了类似的问题。我也不使用Vue CLI。

Answer 1

因此，我决定删除所有组件和插件，看看Vue和Bootstrap是否在IE11中独立工作。它工作得很好，我在控制台中收到了通常的Vue dev消息。

然后我一个一个地添加到每个模块中，直到网站不再在IE11中呈现。只有当启用了lottie-vuejs时才会发生这种情况，并且在检查控制台时会显示一个语法错误(期望“}”)。

所以我的项目不起作用是因为这个插件。