Signature_pad: IE11-Syntaxfehler

Ich habe keine Ahnung, wie der Build-Prozess von Angular 6 aussieht, aber Sie sollten ihn mit derselben Babel-Konfiguration kompilieren, die Sie zum Kompilieren Ihres eigenen Codes verwenden.

Sie können auch die Funktion webpack resolve.alias (nicht getestet) verwenden, die es Ihnen ermöglichen sollte, stattdessen die bereits kompilierte Version zu laden:

module.exports = {
  //...
  resolve: {
    alias: {
      signature_pad: 'signature_pad/dist/signature_pad.js'
    }
  }
};

Vielen Dank für Ihre schnelle Antwort.
Ich werde es versuchen. Ich werde auch eine Babel-Polyfüllung ausprobieren, wenn Ihre Idee nicht funktioniert. Ich habe es noch nie benutzt.

Versuchen Sie, auf diese Weise zu importieren:
Wechsel von:
import SignaturePad from 'signature_pad';
zu:
import * as SignaturePad from 'signature_pad/dist/signature_pad';

Funktion herunterladen (Daten-URL, Dateiname) {
if (navigator.userAgent.indexOf("Safari") > -1 && navigator.userAgent.indexOf("Chrome") === -1) {
window.open (dataURL);
}
### //Fügen Sie die folgende Anweisung zu app.js hinzu - es funktioniert, da die anderen beiden nicht auf IE 11 unterstützt werden
sonst if(window.navigator && window.navigator.msSaveOrOpenBlob){var blobwin = dataURLToBlob(dataURL);window.navigator.msSaveOrOpenBlob(blobwin, Dateiname);}
anders {
var blob = dataURLToBlob(dataURL);
var url = window.URL.createObjectURL(blob);

var a = document.createElement("a");
a.style = "display: none";
a.href = url;
a.download = filename;

document.body.appendChild(a);
a.click();

window.URL.revokeObjectURL(url);

}
}

Die Problemumgehung von @sdqwerty hat bei mir funktioniert. Es ist jedoch erwähnenswert, dass Webpack ein Feld namens mainFields hat, das standardmäßig ['browser', 'module', 'main'] ist. Diese sind nach Priorität geordnet, und signature_pad enthält kein browser in package.json , sodass das Modul abgeholt wird. Dies wird der Datei .m.js zugeordnet, die eine ES6-Syntax wie eine Klasse enthält, die von IE11 nicht unterstützt wird.

@szimek Ich empfehle Ihnen, package.json zu aktualisieren, um ein Browserfeld gemäß den Empfehlungen von npm hier einzuschließen:
https://docs.npmjs.com/files/package.json#browser

Das sollte diese IE11-Probleme klären.

Das hat bei mir funktioniert:

module.exports = {
  resolve: {
    alias: {
      'signature_pad': 'signature_pad/dist/signature_pad' // <- hier without '.js' at the end!
    }
  }
};

Und mit Laravel-Mix:

mix.webpackConfig({
    resolve: {
        alias: {
            'signature_pad': 'signature_pad/dist/signature_pad',
        }
    }
});

Ich habe keine Ahnung, wie der Build-Prozess von Angular 6 aussieht, aber Sie sollten ihn mit derselben Babel-Konfiguration kompilieren, die Sie zum Kompilieren Ihres eigenen Codes verwenden.

Sie können auch die Funktion webpack resolve.alias (nicht getestet) verwenden, die es Ihnen ermöglichen sollte, stattdessen die bereits kompilierte Version zu laden:

module.exports = {
  //...
  resolve: {
    alias: {
      signature_pad: 'signature_pad/dist/signature_pad.js'
    }
  }
};

Die kompilierte Version v3.0.0-beta.4 unterstützt IE11 aufgrund des Schlüsselworts class nicht.