Signature_pad: Create React App에서 SignaturePad가 작동하지 않음

@taylorlapeyre 신고
이 : __WEBPACK_IMPORTED_MODULE_1_signature_pad___default.a 은 다음과 같습니다 : "/static/media/signature_pad.2ceae229.mjs" .

나는 무엇이 잘못되었는지 알아 내려고 노력할 것이다. 그러나 누군가가 어떤 아이디어를 가지고 있고 수정으로 PR을 만들 수 있다면 그것은 굉장 할 것이다.

@taylorlapeyre 나는 무엇이 잘못되었는지 알아 냈고 실제로 react-create-app 의 버그라고 생각하지만 여기에서도 쉽게 수정할 수 있습니다. 문제는 Webpack 2가 signature_pad.mjs 파일에있는 ES6 버전을로드하지만 react-create-app Webpack 구성이 .mjs 확장자를 가진 파일을 처리하는 방법을 모른다는 것입니다. -이것이 파일 이름을 반환하는 이유입니다.

@szimek 아, 말이 되네요. 이 경우 수정은 아마도 Create React App에 있어야한다고 생각합니다. 저기서 홍보하고 싶니? 출발점을 알려 주시면 받아도 돼요 🙂

기록을 위해-해결 방법은 signature_pad.js 파일을 src 디렉토리에 직접 복사하는 것입니다. 일단 그렇게하면 예상대로 가져올 수있었습니다.

@szimek에 대한 빠른 답변에 감사드립니다. @taylorlapeyre와 I의 작업은 ... 그냥은 REPO를 포크와 밖으로 쓰는 빌드 프로세스를 변경 .js 대신의 파일 .mjs 파일을. 우리의 create-react-app 컨텍스트에서 완전히 작동하는지 확인할 수 있습니다! 그러나 예, mjs가 문제이기 때문에 더 많은 문제처럼 들립니다.

다시 한 번, 이미 이것을 CRA에 가져간 @szimek에 대한 거대한 소품 ... mjs 지원에별로 관심이없는 것 같습니다 ...

umd 빌드를 다른 이름 (예 : signature_pad.umd.js 내보내고 모듈 빌드에 signature_pad.js 를 사용하는 패치를 만들 수 있습니다. 그러나 현재 배포에 얼마나 많은 영향을 미칠지 확실하지 않습니다. 또한 현재이 사용 사례가 얼마나 일반적인지 잘 모르겠습니다 ... 어느 쪽이든 Google에서 어떻게 도와 드릴 수 있는지 알려주세요!

예, 그러나이 파일의 이름을 signature_pad.es6.js 로 변경하여 모든 곳에서 지원되는지 확인하는 것이 좋습니다. 그러나 dist 파일의 이름을 바꾸려면 주요 릴리스가 필요하므로 잠시 기다려야 할 수 있습니다. 주요 릴리스 (# 240)가 필요한 기본 및 명명 된 내보내기와 관련된 또 다른 문제를 확인해야합니다. 둘 다 동시에 할 수도 있습니다.

더 나은 해결 방법은 js 파일을 직접 가져 오는 것입니다.

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

해결 방법에 감사드립니다. signature_pad/dist/signature_pad.js 에서 가져 오기는 atm에서 작동합니다.

이를 처리하는 방법에 대한 Facebook의 공식 권장 사항이 있습니다.
기본적으로 그들은 ES6가 앞으로 몇 년 동안 완전히 지원되는 것으로 간주 될 수 없으므로 도서관은 ES5 코드를 게시해야한다고 제안합니다. Readme에서 다음 섹션을 참조하십시오.

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

알려줄 줄 알았는데.

아직 시도하지 않았지만 create-react-app v2는 node_modules 에서도 코드를 컴파일해야합니다-https: //github.com/facebook/create-react-app/pull/3776. signature_pad 의 v3 (현재 베타 버전)은 더 이상 mjs 확장을 사용하지 않으므로 확인하는 것이 좋지만 create-react-app v2에서 작동해야합니다.

CRA 2 및이 라이브러리의 최신 베타 버전을 사용할 때 여전히 문제가있는 경우이 문제를 다시여십시오.