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==)

コメントを残す

メールアドレスが公開されることはありません。