IE 11 或更低版本中的 Vue 应用空白页面，即使使用 polyfill

Question

我在 Firefox、Edge 和 Chrome 中有一个 Vue 应用程序运行，但是，在 IE 11（或更低版本）中，我看到一个空白页面。在 IE 的控制台中看到类似 SCRIPT1002: Syntax error app.js 和 SCRIPT5022: SecurityError sockjs.js.

的内容

语法错误转到包含以下内容的行：eval("__webpack_require__.r(__webpack....Verry long string).

安全错误转到包含以下内容的块：

var Driver = global.WebSocket || global.MozWebSocket;
if (Driver) {
    module.exports = function WebSocketBrowserDriver(url) {
        return new Driver(url); // Where this line is marked
    };
} else {
    module.exports = undefined;
}

经过一番研究，我发现这可能与缺少 polyfills 有关。所以我将 import "@babel/polyfill"; 添加到 main.ts 并将 presets: [["@vue/app", { useBuiltIns: "entry" }]] 添加到 babel.config.js。但是在IE中出现同样的错误。我尝试了 https://cli.vuejs.org/guide/browser-compatibility.html 中描述的其他一些方法。但是 none 对我来说是成功的。

在这一点上，我完全一无所知，因为互联网上的类似问题都指向缺少 polyfill。

关于该应用程序的一些额外信息：

使用 Vue cli 3 创建
使用打字稿。
使用一些新的 js 功能，例如 Object.entries

更新：

仔细查看错误，我发现 IE11 在我的应用程序中加载 vuex-persist 模块时出现问题。我正在继续搜索。

Answer 1

所以问题出在我使用的依赖项上。 vuex-persist 导致了这个问题。解决方法是在 vue.config.js 中添加以下内容：

module.exports = {

/* ... other config ... */

  transpileDependencies: ['vuex-persist']

}

感谢：https://forum.vuejs.org/t/internet-explorer-11-script1002-blank-page-error/53327/5

IE 11 或更低版本中的 Vue 应用空白页面，即使使用 polyfill

Vue app blank page in IE 11 or lower even with polyfills

polyfills

typescript

internet-explorer-11

vue.js

babeljs