0.3.4

.github/workflows/ci.yml

@@ -9,6 +9,7 @@ on:
   push:
     branches:
       - main
+      - master
       - release/*
       - feat/*
       - fix/*
@@ -73,6 +74,9 @@ jobs:
       - name: Install deps
         run: pnpm install
 
+      - name: Build
+        run: pnpm run build
+
       - name: Test
         run: pnpm run test
 

README.md

@@ -23,10 +23,10 @@ A tool for decoding qrcode.
 
 ## Guide
 
-Use `npm` to install.
+Use `pnpm` to install.
 
 ```bash
-$ npm install --save qrcode-decoder
+$ pnpm install --save qrcode-decoder
 ```
 
 Using in webpack:
@@ -96,31 +96,31 @@ Stops the current `qr` from searching for a QRCode.
 Install dependencies:
 
 ```bash
-$ npm install
+$ pnpm install
 ```
 
 Build code:
 
 ```bash
-$ npm run build
+$ pnpm run build
 ```
 
 Run unit test:
 
 ```bash
-$ npm test
+$ pnpm test
 ```
 
 Modify version in `package.json`, run `release` script:
 
 ```bash
-$ npm run release
+$ pnpm run release
 ```
 
 Publish
 
 ```bash
-$ npm publish
+$ pnpm publish
 ```
 
 ## License

README.zh-CN.md

@@ -23,10 +23,10 @@
 
 ## 使用者指南
 
-通过 npm 下载安装代码
+通过 pnpm 下载安装代码
 
 ```bash
-$ npm install --save qrcode-decoder
+$ pnpm install --save qrcode-decoder
 ```
 
 如果你是 webpack 等环境
@@ -96,31 +96,31 @@ qr.decodeFromCamera(videoElem).then((res) => {
 首次运行需要先安装依赖
 
 ```bash
-$ npm install
+$ pnpm install
 ```
 
 一键打包生成生产代码
 
 ```bash
-$ npm run build
+$ pnpm run build
 ```
 
 运行单元测试，浏览器环境需要手动测试，位于`test/browser`
 
 ```bash
-$ npm test
+$ pnpm test
 ```
 
 修改 package.json 中的版本号，修改 README.md 中的版本号，修改 CHANGELOG.md，然后发布新版
 
 ```bash
-$ npm run release
+$ pnpm run release
 ```
 
-将新版本发布到 npm
+将新版本发布到 pnpm
 
 ```bash
-$ npm publish
+$ pnpm publish
 ```
 
 ## License

TODO.md

@@ -2,4 +2,4 @@
 
 Rewrite unit test.
 
-- [] Rewrite unit test.
+- [x] Rewrite unit test.

demo/camera.html

@@ -20,7 +20,7 @@
     var vConsole = new VConsole();
     console.log('Hello world');
     function main() {
-      var qr = new QrcodeDecoder();
+      var qr = new QrcodeDecoder.default();
       var video = document.querySelector('#video');
       var start = document.querySelector('#start');
       var stop = document.querySelector('#stop');

demo/image.html

@@ -30,7 +30,7 @@
   <script type="module">
     var vConsole = new VConsole();
     function main() {
-      var qr = new QrcodeDecoder();
+      var qr = new QrcodeDecoder.default();
 
       var btn1 = document.querySelector('button#decode1');
       var btn2 = document.querySelector('button#decode2');

demo/video.html

@@ -22,7 +22,7 @@
       var result = document.querySelector('#result');
       var start = document.querySelector('#start');
       var stop = document.querySelector('#stop');
-      var qr = new QrcodeDecoder();
+      var qr = new QrcodeDecoder.default();
 
       start.onclick = startScan;
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "qrcode-decoder",
-  "version": "0.3.2",
+  "version": "0.3.4",
   "description": "Tool for decoding qrcode",
   "main": "dist/index.js",
   "browser": "dist/index.min.js",
@@ -8,6 +8,7 @@
   "module": "dist/index.esm.js",
   "types": "dist/index.d.ts",
   "sideEffects": false,
+  "packageManager": "pnpm@7.11.0",
   "scripts": {
     "build": "ts-node -P scripts/tsconfig.json scripts/bundle.ts commonjs,esm,aio && pnpm run dts && pnpm run copy-file",
     "dts": "tsc src/index.ts --declaration --emitDeclarationOnly --outDir './dist'",
@@ -27,7 +28,7 @@
   },
   "lint-staged": {
     "*.{ts,tsx,md}": [
-      "npm run prettier:fix",
+      "pnpm run prettier:fix",
       "git add ."
     ]
   },
@@ -78,7 +79,7 @@
     "ts-node": "^8.4.1",
     "tslint": "^5.20.1",
     "tslint-config-prettier": "^1.18.0",
-    "typescript": "^3.7.5"
+    "typescript": "^4.4.3"
   },
   "license": "MIT",
   "repository": {

src/index.ts

@@ -1,12 +1,13 @@
-import { Options } from 'jsqr';
+import jsQR, { QRCode, Options } from 'jsqr';
-import jsQR from 'jsqr';
+
+export type CodeResult = QRCode | null;
 
 const videoSize = {
   width: { min: 360, ideal: 720, max: 1080 },
   height: { min: 360, ideal: 720, max: 1080 },
 };
 
-class QrcodeDecoder {
+export class QrcodeDecoder {
   timerCapture: null | NodeJS.Timeout;
   canvasElem: null | HTMLCanvasElement;
   gCtx: null | CanvasRenderingContext2D;
@@ -100,7 +101,10 @@ class QrcodeDecoder {
    *  inversionAttempts - (attemptBoth (default), dontInvert, onlyInvert, or invertFirst)
    *  refer to jsqr options: https://github.com/cozmo/jsQR
    */
-  async _captureToCanvas(videoElem: HTMLVideoElement, options: Options) {
+  async _captureToCanvas(
+    videoElem: HTMLVideoElement,
+    options: Options,
+  ): Promise<CodeResult> {
     if (this.timerCapture) {
       clearTimeout(this.timerCapture);
     }
@@ -142,7 +146,7 @@ class QrcodeDecoder {
 
     const result = await proms();
 
-    return result;
+    return result as CodeResult;
   }
 
   /**
@@ -155,7 +159,10 @@ class QrcodeDecoder {
    *  inversionAttempts - (attemptBoth (default), dontInvert, onlyInvert, or invertFirst)
    *  refer to jsqr options: https://github.com/cozmo/jsQR
    */
-  async decodeFromCamera(videoElem: HTMLVideoElement, options: any = {}) {
+  async decodeFromCamera(
+    videoElem: HTMLVideoElement,
+    options: any = {},
+  ): Promise<CodeResult> {
     const opts = {
       ...this.defaultOption,
       ...options,
@@ -197,6 +204,8 @@ class QrcodeDecoder {
       const code = await this.decodeFromVideo(videoElem, opts);
       return code;
     }
+
+    return null;
   }
 
   /**
@@ -207,7 +216,10 @@ class QrcodeDecoder {
    *  inversionAttempts - (attemptBoth (default), dontInvert, onlyInvert, or invertFirst)
    *  refer to jsqr options: https://github.com/cozmo/jsQR
    */
-  async decodeFromVideo(videoElem: HTMLVideoElement, options = {}) {
+  async decodeFromVideo(
+    videoElem: HTMLVideoElement,
+    options = {},
+  ): Promise<CodeResult> {
     const opts = {
       ...this.defaultOption,
       ...options,
@@ -229,20 +241,16 @@ class QrcodeDecoder {
    *  refer to jsqr options: https://github.com/cozmo/jsQR
    */
   async decodeFromImage(
-    img: HTMLImageElement,
+    img: HTMLImageElement | string,
     options: { crossOrigin?: string } = {},
-  ) {
+  ): Promise<CodeResult> {
     let imgDom: HTMLImageElement | null = null;
     const opts = {
       ...this.defaultOption,
       ...options,
     };
-    if (+img.nodeType > 0) {
+
-      if (!img.src) {
+    if (typeof img === 'string') {
-        throw new Error('The ImageElement must contain a src');
-      }
-      imgDom = img;
-    } else if (typeof img === 'string') {
       imgDom = document.createElement('img');
       if (options.crossOrigin) {
         imgDom.crossOrigin = options.crossOrigin;
@@ -253,6 +261,11 @@ class QrcodeDecoder {
           imgDom!.onload = () => resolve(true);
         });
       await proms();
+    } else if (+img.nodeType > 0) {
+      if (!img.src) {
+        throw new Error('The ImageElement must contain a src');
+      }
+      imgDom = img;
     }
 
     let code = null;
@@ -279,7 +292,7 @@ class QrcodeDecoder {
       return code;
     }
 
-    return false;
+    return null;
   }
 
   /**

tsconfig.json

@@ -11,7 +11,10 @@
     "experimentalDecorators": true,
     "preserveConstEnums": true,
     "importHelpers": false,
-    "lib": ["esnext", "dom"],
+    "lib": [
+      "esnext",
+      "dom"
+    ],
     "module": "ESNext",
     "moduleResolution": "node",
     "sourceMap": false,