Question

来自新手的问题。我正在尝试按照Working with IndexedDB使用Jake Archibald's IDB library的教程，但使用的是Typescript而不是普通的Javascript。到目前为止，我没有取得多大成功。

我的代码看起来像这样。

import * as idb from "./idb";

const dbPromise: Promise<idb.DB> = idb.default.open('test-db2', 1, (upgradeDb: idb.UpgradeDB) => {
    console.log('making a new object store');
    if (!upgradeDb.objectStoreNames.contains('firstOS')) {
        upgradeDb.createObjectStore('firstOS');
    }
});

定义文件加载良好，因为编译器不会抛出任何错误，并且智能感知在VS代码中正常工作。

我设法在我的html页面上使用require.js加载我的模块，但控制台显示以下错误：

Uncaught TypeError: Cannot read property 'default' of undefined
at Object.<anonymous> (main.ts:8)
at Object.execCb (require.min.js:5)
at b.check (require.min.js:5)
at b.<anonymous> (require.min.js:5)
at require.min.js:5
at require.min.js:5
at each (require.min.js:5)
at b.emit (require.min.js:5)
at b.check (require.min.js:5)
at b.enable (require.min.js:5)

现在，如果我从对default的调用中删除idb.default.open(...)，编译器会告诉我'/ idb'类型中不存在'open'。该库导出idb作为其默认值。

我缺少某种初始化但我无法真正看到什么或在哪里。

有人可以帮忙吗？

周围工作

这就是我最终完成这项工作的方式。

import * as idxdb from "./idb";
import "./js/idb.js";

let dbPromise: Promise<idxdb.DB> = idb.open('test-db2', 1, (upgradeDb: idxdb.UpgradeDB) => {
    console.log('making a new object store');
    if (!upgradeDb.objectStoreNames.contains('firstOS')) {
        upgradeDb.createObjectStore('firstOS');
    }
});

第一个import语句带来了类型，因此它编译并提供提示。第二个语句将idb对象添加到组合中。

非常感谢@Josh指出我正确的方向。

Answer 1

嗯，不是打字稿专家，但在学习了一些模块语法之后，它看起来像是一个模块问题。查看https://github.com/jakearchibald/idb/blob/master/lib/idb.js的代码，您会看到在浏览器上下文中，变量idb的末尾是self.idb = exp;。

因此，您尝试使用ES6模块语法导入模块，但您导入的文件不是模块，因为它没有导出，也没有默认导出。

（1）您可以下载idb.js文件并在最后插入导出默认值，然后继续导入默认导出值。

（2）您可以学习如何在不导出任何内容的情况下将脚本文件导入为模块。

在2下，因为self在浏览器中是window，你可能只是直接访问变量idb，因为通过包含它在全局范围内定义的文件。

因此，首先要使用import "./idb.js"导入文件，忽略它导出的内容。这种导入语法风格忽略了导出的内容。因为我们知道idb.js不会导出任何东西，所以这很好，因为它是导入没有导出的文件所需的最少工作量。并且导入的结果是它被评估，这意味着导入将在窗口的全局范围内声明idb作为模块的隐含副作用（定义全局变量通常在模块中不受欢迎但是这没关系因为这是非模块的。）

所以......如果您在浏览器环境中工作，请尝试以下操作：

import "./idb.js";

// This should print out information about the idb object declared in 
// global scope of the browser (e.g. under window.idb)
console.log(idb); 

// Because the variable idb is basically just a global, just access 
// here as it comes from the global
const dbPromise: Promise<idb.DB> = idb.open(...);

Answer 2

import idb from 'idb';

这对我有用。

Answer 3

导入默认导出时，语法为：

import idb from "./idb";

这仅适用于默认导出。

然后您应该可以使用：

idb.open(/* ... */)

Answer 4

我认为这可能是因为idb javascript不支持AMD加载程序（例如我正在使用的require.js）。

在index-min.js的末尾添加以下行对我有用：

    @app.route('/srv_status', methods=['GET'])
    def get_srv_status():
        return 'OK', 200  # just means we're on air

使用indexedDB的Typescript和IDB库。需要指导

4 个答案: