如何在Angular-Cli/Webpack中导入PouchDb-Find

Question

我想要在使用Angular-cli（现在基于Webpack）生成的项目中，使用Angular 2/Typescript与PouchDb和PouchDb-Find。通过简单的导入语句，就可以将PouchDb连接起来：import * as PouchDB from 'pouchdb'。请注意，保留HTML标记。

var commonDb = new PouchDB(this.commonDbUrl) ;
console.log("commonDb",commonDb) ;

// .getIndexes() is from pouchDb.find. I don't know what the import for it is
commonDb.getIndexes().then(function (result) {
    console.log("GetIndexes.Success",result) ;
}).catch(function (err) {
    console.log("GetIndexes.Failed",err) ;
});

新版PouchDb能够正常运行，但commonDb.getIndexes无法使用。我已经尝试多种import * as pouchfind from 'pouchdb-find'的变种，但都没有成功。请问如何导入PouchDb-Find模块？

- jeff

---

你必须进行一些设置来使 PouchDB 起作用，是吗？例如 npm install ... 和其他操作。你做了什么？（你是否也为 PouchDB-Find 进行了相同的操作？） - acdcjunior

我已经为PouchDb和PouchDb find执行了NPM安装。所以它们都在node_modules中。我的理解是webpack查看导入语句以确定要带入捆绑包的内容。我只是不知道导入语句应该是什么样子的。 - jeff

import * as PouchDB from 'pouchdb' 能正常工作吗？ - acdcjunior

import * as PouchDb from pouchdb`可以正常工作。我已经获得了PouchDB的功能。在问题中添加了更多信息。 - jeff

你安装了它们的类型定义吗？如果是，是哪些类型定义？ - acdcjunior

我为pouchdb执行了npm install @types/pouchdb --save，但是没有找到pouchdb-find的类型定义。 - jeff

Answer 1

这对我有效。

安装npm软件包。

npm install --save pouchdb-browser
npm install --save pouchdb-find

并编写了这段代码

import PouchDB from 'pouchdb-browser';
import PouchDBFind from 'pouchdb-find';
PouchDB.plugin(PouchDBFind);

- Katsumi Honda

Answer 2

在Angular 6中，您应该将以下内容添加到polyfills.ts文件中：

(window as any).global = window;
(window as any).process = {};
(window as any).process.nextTick = setTimeout;

使用PouchDB/PouchDB-find，您需要将以下代码添加到您的服务/控制器中：

import PouchDB from 'pouchdb';
import PouchFind from 'pouchdb-find';
PouchDB.plugin(PouchFind);

- trojek

---

我认为这需要将TSC的esModuleInterop选项设置为true。(不确定这是否是Angular-CLI中的默认设置) - derekbaker783

Answer 3

这应该可以工作：

import * as PouchDB from 'pouchdb'
import * as PouchFind from 'pouchdb-find'
PouchDB.plugin(PouchFind)

对于 typings，我不知道 pouchdb-find 有没有相应的 typings，因此你需要使用 any。

- nlawson

---

我一直在使用pouchdb-find时遇到了“找不到模块”的错误，尽管我已经进行了NPM安装并验证了它在node_modules文件夹中。可能是angular-cli的问题。 - jeff

仅针对PouchDB，我使用了import PouchDB from 'pouchdb';。 - slavugan

Answer 4

我怀疑我无法按预期的方式解决这个问题，因为Angular-Cli仍处于测试版阶段，可能存在一些问题。

我通过将pouchdb.find.js和poucdb.js放入public/pouchdb文件夹中，并在index.html中引用它们来解决了这个问题。我很清楚这只是一个权宜之计，需要找到更好的解决方法。

<script src="pouchdb/pouchdb.js"></script>
<script src="pouchdb/pouchdb.find.js"></script>

<script>
    PouchDB('pouchdbfind') ;
</script>

我希望Angular-cli能够快速成熟。

- jeff

Answer 5

有点晚了，但我也遇到了同样的问题，并且不会使用script src方式...

我正在使用nodejs 7.x的nvm，没有意识到在Mac上重新启动后，nvm use xxx会丢失。

切换到nodejs 7.1.0后，一切都正常了...

SO：注意你的npm版本

希望对你有所帮助

Pitt

- pdewaard