Signature_pad: SignaturePad funktioniert nicht mit Create React App

@ Taylorlapeyre Danke für den Bericht. Es ist wirklich seltsam, weil es so aussieht, als würde anstelle des eigentlichen JS-Codes ein Pfad zu einer Datei zurückgegeben, d. H.
this: __WEBPACK_IMPORTED_MODULE_1_signature_pad___default.a entspricht this: "/static/media/signature_pad.2ceae229.mjs" .

Ich werde versuchen herauszufinden, was los ist, aber wenn jemand eine Idee hat und eine PR mit einem Fix erstellen könnte, wäre das großartig.

@taylorlapeyre Ich habe herausgefunden, was los ist und ich denke, es ist tatsächlich ein Fehler in react-create-app , obwohl ich ihn auch hier leicht beheben könnte. Das Problem ist, dass Webpack 2 die ES6-Version lädt, die sich in der Datei signature_pad.mjs , aber ich denke, die Webpack-Konfiguration in react-create-app weiß nicht, wie Dateien mit der Erweiterung .mjs - Deshalb wird ein Dateiname zurückgegeben.

@szimek ahh, das macht Sinn. Ich denke, dass das Update in diesem Fall wahrscheinlich in der Create React App sein sollte. Möchten Sie dort eine PR machen? Ich kann es auch nehmen, wenn Sie mir einen Ausgangspunkt geben, um von 🙂 zu gehen

Nur zur Veranschaulichung - die Problemumgehung für uns bestand einfach darin, die Datei signature_pad.js direkt in unser Verzeichnis src kopieren. Sobald wir das getan haben, konnten wir es wie erwartet importieren.

Vielen Dank für die schnelle Antwort, @szimek. Ich arbeite mit @taylorlapeyre ... Ich habe gerade das Repo gegabelt und den Erstellungsprozess geändert, um eine .js -Datei anstelle der .mjs -Datei zu schreiben. Ich kann bestätigen, dass dies in unserem Create-React-App-Kontext völlig funktioniert! Aber ja, hört sich an ihrem Ende eher nach einem Problem an, da mjs eine Sache ist.

Noch einmal, riesige Requisiten an wären sie sehr daran interessiert, mjs obwohl ... woof.

Wir könnten einen Patch erstellen, der den Build umd unter einem anderen Namen exportiert, z. B. signature_pad.umd.js und signature_pad.js für den Modul-Build verwendet. Ich bin mir jedoch nicht sicher, welchen Einfluss dies auf Ihre aktuelle Distribution haben wird. Ich bin mir auch nicht sicher, wie häufig dieser Anwendungsfall im Moment ist ... Lassen Sie uns in jedem Fall wissen, wie wir Ihnen helfen können!

Ja, es kann jedoch sinnvoll sein, diese Datei einfach in signature_pad.es6.js umzubenennen, um sicherzustellen, dass sie überall unterstützt wird. Das Umbenennen von dist-Dateien erfordert jedoch erneut eine Hauptversion, sodass dies möglicherweise eine Weile warten muss. Ich muss ein anderes Problem im Zusammenhang mit dem Standard- und dem benannten Export untersuchen, für das ebenfalls eine Hauptversion erforderlich ist (Nr. 240). Vielleicht mache ich sie beide gleichzeitig.

Eine bessere Problemumgehung besteht darin, die js-Datei direkt zu importieren

import SignaturePad from 'signature_pad/dist/signature_pad.js';

Vielen Dank für die Problemumgehung. Der Import von signature_pad/dist/signature_pad.js funktioniert für uns atm.

Es gibt eine offizielle Empfehlung von Facebook, wie damit umgegangen werden könnte.
Grundsätzlich wird vorgeschlagen, dass ES6 erst in einigen Jahren als vollständig unterstützt betrachtet werden kann. Daher sollten Bibliotheken ES5-Code veröffentlichen. Siehe diesen Abschnitt in der Readme-Datei:

https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#npm -run-build-failed-to-minify

Ich dachte, ich würde es dich wissen lassen.

Ich habe es noch nicht ausprobiert, aber create-react-app v2 sollte auch Code in node_modules kompilieren - https://github.com/facebook/create-react-app/pull/3776. Die Version mjs (derzeit in der Beta-Version) von signature_pad keine mjs -Erweiterung mehr, daher sollte sie mit create-react-app v2 funktionieren, obwohl es großartig wäre, dies zu bestätigen.

Bitte öffnen Sie dieses Problem erneut, wenn bei Verwendung von CRA 2 und der neuesten Beta-Version dieser Bibliothek weiterhin ein Problem auftritt.