# @techstark/opencv-js

> OpenCV JavaScript version for node.js or browser

Latest version **5.0.0-release.1** (published 2026-06-24) · Apache-2.0 license · 0 weekly downloads

## Install

```sh
npm install @techstark/opencv-js
pnpm add @techstark/opencv-js
yarn add @techstark/opencv-js
bun add @techstark/opencv-js
```

## Health

**Score 70/100 (B)** — status: active.

Positive: has types; no vulnerabilities; has provenance; recently updated; high maintenance score; high quality score.

Warnings: low downloads; no esm support; large bundle.

## Facts

| | |
|---|---|
| Version | 5.0.0-release.1 |
| Published | 2026-06-24 |
| First published | 2021-02-12 |
| Weekly downloads | 0 |
| License | Apache-2.0 |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 14 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Provenance | attested (GitHub Actions) |
| GitHub stars | 782 |
| Author | Wilson |
| Maintainers | ttt43ttt |
| Keywords | opencv, javascript, computer vision |

## Links

- npm: https://www.npmjs.com/package/@techstark/opencv-js
- Repository: https://github.com/TechStark/opencv-js
- Homepage: https://github.com/TechStark/opencv-js#readme
- Issues: https://github.com/TechStark/opencv-js/issues
- npm.io page: https://npm.io/package/@techstark/opencv-js

## Recent versions

- 5.0.0-release.1 (latest) — 2026-06-24
- 4.12.0-release.1 — 2025-11-08
- 4.11.0-release.1 — 2025-06-04
- 4.10.0-release.1 — 2024-08-25
- 4.10.0-beta.1 — 2024-08-06
- 4.9.0-release.3 — 2024-03-17
- 4.9.0-release.2 — 2024-01-16
- 4.9.0-release.1 — 2024-01-10
- 4.8.0-release.10 — 2023-11-06
- 4.8.0-release.9 — 2023-10-23
- 4.8.0-release.8 — 2023-10-12
- 4.8.0-release.7 — 2023-10-12
- 4.8.0-release.6 — 2023-10-03
- 4.8.0-release.5 — 2023-10-03
- 4.8.0-release.4 — 2023-08-08
- … 14 more at https://npm.io/package/@techstark/opencv-js/versions

## README

# opencv-js

OpenCV JavaScript version (NPM package) for node.js or browser. Get started guide [OpenCV.js Tutorials](https://docs.opencv.org/5.0.0/#:~:text=OpenCV%2DPython%20Tutorials-,OpenCV.js%20Tutorials,-Tutorials%20for%20contrib).

The file `opencv.js` was downloaded from https://docs.opencv.org/5.0.0/opencv.js

TypeScript is supported (thanks to `mirada`).

# Basic Usage

```js
import cvModule from "@techstark/opencv-js";

async function getOpenCv() {
  let cv;
  if (cvModule instanceof Promise) {
    cv = await cvModule;
  } else {
    if (cvModule.Mat) {
      cv = cvModule;
    } else {
      await new Promise((resolve) => {
        cvModule.onRuntimeInitialized = () => resolve();
      });
      cv = cvModule;
    }
  }
  return { cv };
}

async function main() {
  const { cv } = await getOpenCv();
  console.log("OpenCV.js is ready!");
  // You can now use OpenCV functions here
  console.log(cv.getBuildInformation());
}

main();
```

# Code Examples

- See code examples (React, Angular, Node.js) in [opencv-js-examples](https://github.com/TechStark/opencv-js-examples)

# Live Demo

## Using in react.js project

- See [live demo and code here](https://codesandbox.io/s/techstarkopencv-js-demo-page-f7gvk?file=/src/TestPage.jsx)
  <img src="https://user-images.githubusercontent.com/132509/130320696-eaa3899b-2356-4e9f-bbc9-0a969465c58e.png" height="800px" alt="Live demo screenshot" />
- Get the test image from here [Lenna.png](test/Lenna.png)

## Using in Angular project

- See [code here](https://codesandbox.io/s/techstark-opencv-js-angular-demo-hkmc1n?file=/src/app/app.component.ts)

## Real-time face detection

- See [live demo and code here](https://codesandbox.io/s/opencv-js-face-detection-i1i3u)

![Real-time face detection](https://user-images.githubusercontent.com/132509/160820773-cdb023a6-77a2-4f2e-a0e9-fb06931c8f9f.gif)

# How to Use

- `npm install @techstark/opencv-js`
- or `yarn add @techstark/opencv-js`
- `import cv from "@techstark/opencv-js"`
  - for TypeScript, set `"esModuleInterop": true` in `tsconfig.json`
- or `import * as cv from "@techstark/opencv-js"`

# Webpack Configuration (for browser usage)

If you use this package for browsers, you need to set some polyfills. In the file "webpack.config.js", set

```js
module.exports = {
  resolve: {
    modules: [...],
    fallback: {
      fs: false,
      path: false,
      crypto: false
    }
  }
};
```

# What methods and properties are available

The TypeScript type declarations may not be up to date with the latest OpenCV.js. Refer to [cvKeys.json](doc/cvKeys.json) to check the available methods and properties at runtime.

# Star History

[![Star History Chart](https://api.star-history.com/svg?repos=techstark/opencv-js&type=Date)](https://star-history.com/#techstark/opencv-js&Date)

---
_Source: https://npm.io/package/@techstark/opencv-js · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._