Angular で idb を使うときに発生するasyncIterator プロパティが存在しないエラーの対処方法

Angularは で IndexedDB を使いたいと思い、npm の idb を使用していますが、そのまま使うと 以下のエラーが発生します。

    ERROR in node_modules/idb/build/esm/entry.d.ts(375,13): error TS2339: Property 'asyncIterator' does not exist on type 'SymbolConstructor'.
    node_modules/idb/build/esm/entry.d.ts(375,31): error TS2304: Cannot find name 'AsyncIterableIterator'.
    node_modules/idb/build/esm/entry.d.ts(382,98): error TS2304: Cannot find name 'AsyncIterableIterator'.
    node_modules/idb/build/esm/entry.d.ts(441,13): error TS2339: Property 'asyncIterator' does not exist on type 'SymbolConstructor'.
    node_modules/idb/build/esm/entry.d.ts(441,31): error TS2304: Cannot find name 'AsyncIterableIterator'.
    node_modules/idb/build/esm/entry.d.ts(450,109): error TS2304: Cannot find name 'AsyncIterableIterator'.
    node_modules/idb/build/esm/entry.d.ts(502,13): error TS2339: Property 'asyncIterator' does not exist on type 'SymbolConstructor'.
    node_modules/idb/build/esm/entry.d.ts(502,31): error TS2304: Cannot find name 'AsyncIterableIterator'.
    node_modules/idb/build/esm/entry.d.ts(534,13): error TS2339: Property 'asyncIterator' does not exist on type 'SymbolConstructor'.
    node_modules/idb/build/esm/entry.d.ts(534,31): error TS2304: Cannot find name 'AsyncIterableIterator'.

使用した NPM モジュール

https://www.npmjs.com/package/idb

対処方法

tsconfig.json の lib に esnext.asynciterable を追加します。

    {
      ...
      "compilerOptions": {
        ...
        "lib": [
          ...
          "esnext.asynciterable",
          ...
        ]
      }
    }

検証したソースコード

    import {openDB, DBSchema} from "idb"
    
      async openIndexedDB(){
    
        interface TodoDB extends DBSchema {
          "todo-db": {
            key: string,
            value: {
              workName: string,
              planMinutes: number,
              planSeconds: number,
              isDone: boolean,
            }
          }
        }
    
        const db = await openDB<TodoDB>('todo-db', 1, {
          upgrade(db) {
            db.createObjectStore('todo-db')
          }
        })
    
      }

参考にしたサイト

https://github.com/apollographql/graphql-subscriptions/issues/83

[商品価格に関しましては、リンクが作成された時点と現時点で情報が変更されている場合がございます。]

AngularによるモダンWeb開発 実践編 実際の開発で必要な知識を凝縮【電子書籍】[ 末次 章 ]
価格:3780円 (2019/7/23時点)

[

楽天で購入

](https://hb.afl.rakuten.co.jp/hgc/18648e8b.7d833591.18648e8c.ed1bab3c/?pc=https%3A%2F%2Fitem.rakuten.co.jp%2Frakutenkobo-ebooks%2Ff02e78a39537375b9f7aefaa40a47e98%2F%3Fscid%3Daf_pc_bbtn&m=http%3A%2F%2Fm.rakuten.co.jp%2Frakutenkobo-ebooks%2Fi%2F17548273%2F%3Fscid%3Daf_pc_bbtn&link_type=picttext&ut=eyJwYWdlIjoiaXRlbSIsInR5cGUiOiJwaWN0dGV4dCIsInNpemUiOiIyNDB4MjQwIiwibmFtIjoxLCJuYW1wIjoicmlnaHQiLCJjb20iOjEsImNvbXAiOiJkb3duIiwicHJpY2UiOjEsImJvciI6MSwiY29sIjoxLCJiYnRuIjoxfQ==)

速攻でメモできる QuickNote リリースしました!

QuickNoteは動作が超軽量でサクサクかけるノートアプリです。一瞬の閃きを逃さずにノートを開き書き始めることができます。 アカウント登録も不要です。お試しあれ!

Excel操作をコマンドで! proBoarderExcel

Excelはマウスで操作するのが基本ですが、マウス操作に疲れてはいませんか? キーボードでExcel操作ができるようになるアプリです。オープンソースで無料です。

積み上げ! Daily Stack リリースしました!

Daily Stack は日々の積み上げを管理するToDoアプリです。過去の積み上げの振り返りだけでなく、ツイート機能もあります。 アカウント登録不要ですぐに使い始めることができます。

ExecNote.app リリースしました!

ExecNoteは、コードが実行できるMarkdownアプリケーションです。Markdownドキュメント内に記載したコードをクリックすると実行ができます。わざわざターミナルを 起動させる必要がありません!無料ですのでもしよければダウンロードをお願いします。

About Me

11年目のシステムエンジニアです。アプリで生活や仕事を改善したい🐱仕事効率化、自動化のアプリ開発が得意です、ご相談ください。 🚀エンタメ系アプリの開発も模索中🐬社内SEや個人アプリ開発者、システムエンジニアになりたい人と繋がりたい🐱