typescript - Vue-app blank sida i IE 11 eller lägre även med polyfills

Jag har en Vue-app som körs i Firefox, Edge och Chrome, men i IE 11 (eller lägre) ser jag en tom sida. Och i konsolen i IE ser jag något som SCRIPT1002: Syntaxfel app.js och SCRIPT5022: SecurityError sockjs.js.

Syntaxfelet går till en rad som innehåller: eval("__webpack_require__.r(__webpack....Verry long string).

Säkerhetsfelet går till ett block som innehåller:

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;
}

Efter lite forskning upptäckte jag att det kan ha något att göra med saknade polyfills. Så jag lade till import "@babel/polyfill"; i main.ts och presets: [["@vue/app", { useBuiltIns: "entry" }]] i babel.config.js. Men samma fel uppstår i IE. Jag försökte några andra metoder som beskrivs på https://cli.vuejs.org/guide/browser-compatibility.html. Men ingen gav framgång för mig.

Vid det här laget är jag helt utan ledtrådar eftersom liknande problem på internet alla pekar på saknade polyfills.

Lite extra information om appen:

  • Skapades med Vue CLI 3
  • Använder TypeScript.
  • Använder några nya js-funktioner som Object.entries

Uppdatering :

När jag tittar lite mer på felet har jag upptäckt att IE11 har problem med att ladda vuex-persist-modulen i min app. Jag fortsätter min sökning.

Svar #1

Så problemet var med ett beroende jag använde. vuex-persist orsakade problemet. Lösningen var att lägga till följande i vue.config.js:

module.exports = {

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

  transpileDependencies: ['vuex-persist']

}

Tack till: https://forum.vuejs.org/t/internet-explorer-11-script1002-blank-page-error/53327/5

Relaterade artiklar