SignaturePad 未定义 - 无法将 signature_pad 模块初始化为脚本
SignaturePad not defined - can not initialise signature_pad module into script
我在使用 npm 模块时遇到问题 - signature_pad,似乎无法设置它。目前我使用的是香草 HTML、CSS 和 JS。目前我一直收到一条错误消息:SignaturePad is not defined
。我尝试使用 import SignaturePad from 'signature_pad'
从我的 package.JSON 文件中导入模块,但我收到一条错误提示 unexpected token import
.
我在下面附上了我的 HTML 和 JS 代码。有什么建议吗?
JavaScript
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>
已解决。交换脚本的顺序并首先制作 signature_pad.min.js 脚本似乎已经解决了它。
<script src="https://cdnjs.cloudflare.com/ajax/libs/signature_pad/1.5.3/signature_pad.min.js"></script>
<script type="text/javascript" src="./js/sig_pad.js"></script>
我在使用 npm 模块时遇到问题 - signature_pad,似乎无法设置它。目前我使用的是香草 HTML、CSS 和 JS。目前我一直收到一条错误消息:SignaturePad is not defined
。我尝试使用 import SignaturePad from 'signature_pad'
从我的 package.JSON 文件中导入模块,但我收到一条错误提示 unexpected token import
.
我在下面附上了我的 HTML 和 JS 代码。有什么建议吗?
JavaScript
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>
已解决。交换脚本的顺序并首先制作 signature_pad.min.js 脚本似乎已经解决了它。
<script src="https://cdnjs.cloudflare.com/ajax/libs/signature_pad/1.5.3/signature_pad.min.js"></script>
<script type="text/javascript" src="./js/sig_pad.js"></script>