Currently utilizing NextJS with TypeScript The following script has been added:
<Head><link href="/css/bindingbox.min.css" rel="stylesheet"></link><script async type="text/javascript" src="/scripts/annotorious.min.js"></script></Head>
Upon trying to call:
useEffect(()=>{
setTimeout(() => {
var anno = Annotorious.init({
image: "raven_cafe",
readOnly: true,
});
anno.loadAnnotations('/scripts/annotations.w3c.json');
//disable displaying the binding box when selected on the image
anno.on('selectAnnotation', function(data) {
let element = document.querySelector(`g[data-id="`+data.id+`"]`);
element.classList.remove('selected');
});
}, 100);
},[]);
An error in TypeScript is raised: "Cannot find name 'Annotorious'" How can this error be resolved?