pouchdb: PouchDB not working with Angular 6.0.0

The following in polyfills.ts will fix PouchDB with PouchDBFind plugin:

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

with

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

As suggested,

import * as PouchDB from 'pouchdb/dist/pouchdb';
import * as PouchDBUpsert from 'pouchdb-upsert/dist/pouchdb.upsert';
[..]

does solve the issue in Angular 6. It’s not ideal but it works 😉

The memory adapter also seems to have an issue with indirectly depending on stream via readable-stream:

├─┬ pouchdb-adapter-memory@6.4.3 │ └─┬ pouchdb-adapter-leveldb-core@6.4.3 │ ├─┬ levelup@2.0.1 │ │ └─┬ level-iterator-stream@2.0.0 │ │ └── readable-stream@2.3.6 deduped │ ├─┬ sublevel-pouchdb@6.4.3 │ │ └── readable-stream@1.0.33 │ └─┬ through2@2.0.3 │ └── readable-stream@2.3.6 deduped

ERROR in ./node_modules/sublevel-pouchdb/node_modules/readable-stream/readable.js
Module not found: Error: Can't resolve 'stream' in '/tmp/ng6/node_modules/sublevel-pouchdb/node_modules/readable-stream'
ERROR in ./node_modules/sublevel-pouchdb/node_modules/readable-stream/lib/_stream_readable.js
Module not found: Error: Can't resolve 'stream' in '/tmp/ng6/node_modules/sublevel-pouchdb/node_modules/readable-stream/lib'
ERROR in ./node_modules/sublevel-pouchdb/node_modules/readable-stream/lib/_stream_writable.js
Module not found: Error: Can't resolve 'stream' in '/tmp/ng6/node_modules/sublevel-pouchdb/node_modules/readable-stream/lib'

@daleharvey The Angular CLI uses webpack to build javascript code. I don’t actually know how webpack works, but from what I understood, what happened is that the Angular CLI 6 removed the code that tells webpack to turn node.js built-ins like global and process into code that the browser understands. (link to the commit) Their reasoning is that libraries should not assume the environment they’re running on, and if they’re intended to run both on node and the browser, then they should provide a separate web version. (I tried using pouchdb-browser btw, but I still got the same errors)

I managed to fix the first error I posted above by adding

(window as any).global = window;

to src/polyfills.ts.

The second error comes from PouchDB Find code, which calls process.nextTick() at some point when creating an index. (I saw that you closed an issue related to this, but the current release still uses process.nextTick() instead of setTimeout)

Anyway, for the time being I managed to fix the second error by manually importing the code that webpack uses to polyfill process in the browser. I downloaded this file and saved it as src/node-polyfills/process/polyfill.js (I removed lines 16-24) and then inside src/polyfills.ts added the following code:

import * as pr from './node-polyfills/process/polyfill';
(window as any).process = pr;

I understand this is a workaround, but until the Angular CLI provides a way to override the node webpack config it’ll have to do.

this works for me var PouchDB = require(‘pouchdb-browser’);

let pouchdb = PouchDB.default.defaults(); let db = new pouchdb(‘mydb’); db.info().then(info => console.log(info));

dist/pouchdb.find does seem to expect a global PouchDB object to be available.

You may have better luck with going back to

import PouchDB from 'pouchdb';

and then adding

(window as any).global = window;

to your polyfills.ts file as suggested here

@daleharvey this is worth reopening as it’s still a problem. a one line shim will fix this

import * as PouchDB from ‘pouchdb/dist/pouchdb’;

these code work for me when i code in polymer3. thanks.