1
npm 모듈 - signature_pad를 사용하는 데 문제가있어서 설정하지 못했습니다. 현재 내가 사용하는 것은 바닐라 HTML, CSS 및 JS입니다. 지금은 오류 메시지가 계속 나타납니다 : SignaturePad is not defined. 내 package.JSON 파일을 import SignaturePad from 'signature_pad'을 사용하여 모듈을 가져 오려고했지만 다시 unexpected token import 말하는 오류가 발생합니다.SignaturePad가 정의되지 않았습니다 - signature_pad 모듈을 스크립트로 초기화 할 수 없습니다.
아래 HTML과 JS 코드를 첨부했습니다. 어떤 제안?
자바 스크립트
var wrapper1 = document.getElementById("signature-pad-1"),
canvas1 = wrapper1.querySelector("canvas"),
signaturePad1;
resizeCanvas(canvas1);
signaturePad1 = new SignaturePad(canvas1);
function resizeCanvas(canvas) {
var ratio = window.devicePixelRatio || 1;
canvas.width = canvas.offsetWidth * ratio;
canvas.height = canvas.offsetHeight * ratio;
canvas.getContext("2d").scale(ratio, ratio);
}
HTML 해결
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Sign Here</title>
<link rel="stylesheet" href="main.css">
</head>
<body>
<div class="contract">
<h1>Signature Below</h1>
<p>ABC</p>
<div id="signature-pad-1" class="m-signature-pad">
<div class="m-signature-pad--body">
<canvas></canvas>
</div>
</div>
<script type="text/javascript" src="./js/sig_pad.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/signature_pad/1.5.3/signature_pad.min.js"></script>
</body>
</html>