Signature_pad: Erreur de syntaxe IE11

Je n'ai aucune idée de l'apparence du processus de construction d'Angular 6, mais vous devez le compiler en utilisant la même configuration Babel que celle que vous utilisez pour compiler votre propre code.

Vous pouvez également utiliser la fonctionnalité webpack resolve.alias (non testée), qui devrait vous permettre de charger à la place la version déjà compilée :

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

Merci pour votre réponse rapide.
Je vais essayer. Je vais aussi essayer un babel polyfill si votre idée ne fonctionne pas. Je ne l'ai jamais utilisé auparavant.

Essayez d'importer de cette manière :
changer de:
import SignaturePad from 'signature_pad';
pour:
import * as SignaturePad from 'signature_pad/dist/signature_pad';

téléchargement de fonction (URL de données, nom de fichier) {
if (navigator.userAgent.indexOf("Safari") > -1 && navigator.userAgent.indexOf("Chrome") === -1) {
window.open(dataURL);
}
### //Ajouter l'instruction ci-dessous sur app.js - cela fonctionne car les deux autres ne sont pas pris en charge sur IE 11
sinon si(window.navigator && window.navigator.msSaveOrOpenBlob){var blobwin = dataURLToBlob(dataURL);window.navigator.msSaveOrOpenBlob(blobwin, filename);}
autre {
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);

}
}

La solution de contournement de @sdqwerty a fonctionné pour moi. Cependant, il convient de noter que webpack a un champ appelé mainFields dont la valeur par défaut est ['browser', 'module', 'main'] . Ceux-ci sont dans l'ordre de priorité, et signature_pad n'inclut pas un browser dans package.json , donc le module est récupéré. Cela correspond au fichier .m.js , qui inclut la syntaxe ES6 comme la classe - qu'IE11 ne prend pas en charge.

@szimek Je vous recommande de mettre à jour package.json pour inclure un champ de navigateur conformément aux recommandations de npm ici :
https://docs.npmjs.com/files/package.json#browser

Cela devrait résoudre ces problèmes d'IE11.

Cela a fonctionné pour moi:

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

Et avec Laravel-Mix :

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

Je n'ai aucune idée de l'apparence du processus de construction d'Angular 6, mais vous devez le compiler en utilisant la même configuration Babel que celle que vous utilisez pour compiler votre propre code.

Vous pouvez également utiliser la fonctionnalité webpack resolve.alias (non testée), qui devrait vous permettre de charger à la place la version déjà compilée :

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

La version compilée v3.0.0-beta.4 ne prend pas en charge IE11 en raison du mot-clé class .