ReferenceError: cv is not defined

[WisarutBholsithi]

Now, I just try to use OpenCV in javascript for my project that use Angular Platform and I have already declare cv in he following fashion.

import {CV as cv} from "@techstark/opencv-js"

However, when I just declare that

/// human_face.ts
setHead(head: FaceComposition, params?: {}): FaceComposition {
const imageObject = head.imageObj;
const canvas = head.canvas;
const context = head.context;
......const imgData = context.getImageData(0, 0, canvas.width, canvas.height);
let src = cv.matFromImageData(imgData); // => ERROR ReferenceError: cv is not defined
// the way to get image data from canvas context for OpenCV processing!
....
}

I got a problem when i try use function cv.matFromImageData. as "ERROR ReferenceError: cv is not defined", it seems to me that opencv.js has failed to load properly according to the error message.

Therefore, I would like to know how to ensure that opencv.js would be properly loaded into the web.
Hope to get answer son,

[ttt43ttt]

@WisarutBholsithi can you create a minimal app in https://codesandbox.io/ to reproduce it?

[jet-lee-m]

Hi @ttt43ttt ,

I have the same problem like @WisarutBholsithi.

I implemented a simple example on https://codesandbox.io/s/elated-shamir-3s9hg?file=/src/app/app.component.ts that shows the problem.

Neither this variant 'import cv from ...' nor the other variant ' import {Cv as cv} from ...' works.

[ttt43ttt]

@jet-lee-m thanks. Use import * as cv from "@techstark/opencv-js"; in TypeScript.
See https://codesandbox.io/s/serene-jennings-zc81v?file=/src/app/app.component.ts

[ttt43ttt]

cv.COLOR_RGB2BGR may still be undefined. I think it's caused by the JS compiler couldn't finish in browser. Better to try in a local development environment.

[ttt43ttt]

See https://github.com/TechStark/opencv-js-examples/blob/develop/opencv-js-angular-example/src/app/app.component.ts