How to import PouchDb-Find with Angular-Cli/Webpack

问题

I'm want to use Angular 2/Typescript with PouchDb and PouchDb-Find with a project generated with Angular-cli (which is now webpack based.) PouchDb gets wired in with a simple import statement.

import * as PouchDB from 'pouchdb'

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) ;
});

The new PouchDb works, the commonDb.getIndexes does not. I've tried many variations on import * as pouchfind from 'pouchdb-find' to no avail.

How do I import the PouchDb-Find module?

回答1:

This works for me.

Install npm packages.

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

and wrote this code

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

回答2:

In Angular 6 you should add into polyfills.ts:

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

Then to use PouchDB/PouchDB-find you should add the following lines to your service/controller:

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

回答3:

This should work:

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

For the typings, there are no typings for pouchdb-find that I'm aware of, so you'll have to use any.

回答4:

I suspect that I wasn't able to resolve this problem in the expected way because Angular-Cli is still in beta and there must be some issues.

I was able to resolve the problem by putting pouchdb.find.js and poucdb.js in the public/pouchdb folder and referencing them from index.html as in the following. I'm well aware that this is a work around and will require a work around.

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

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

I'm hopeful Angular-cli will mature quickly.

回答5:

little bit late, but I had the same trouble and won't use the script src way...

I'm using nvm with nodejs 7.x and wasn't aware that nvm use xxx will be lost on Mac after doing a reboot.

After switching to nodejs 7.1.0 all works as expected...

SO: watch your npm version

HTH

Pitt

来源：https://stackoverflow.com/questions/38686371/how-to-import-pouchdb-find-with-angular-cli-webpack

标签

angular

Webpack

pouchdb