Pouchdb doesn't work?

Ionic Framework
1

I am trying to install pouchdb in a typescript (ionic) application. The types don’t work (?)

npm install --save pouchdb
npm install --save-dev @types/pouchdb

When I try to use it (import Pouchdb from ‘pouchdb’), I get this error

ERROR in src/app/services/pouchdb.service.ts(3,8): error TS1192: Module ‘“C:/Users/User/PROG/toto/node_modules/@types/pouchdb/index”’ has no default export.

I tried to add esModuleInterop : true to the tsconfig.app.json file (I’m using IONIC V4). It doesn’t work, I still get the same error when trying import PouchDB from 'Pouchdb' :

ERROR in src/app/services/pouchdb.service.ts(4,9): error TS1192: Module ''pouchdb-find'' has no default export. [ng] src/app/services/pouchdb.service.ts(5,9): error TS1192: Module '"C:/Users/User/PROG/toto/node_modules/@types/pouchdb/index"' has no default export.
[ng] i ｢wdm｣: Failed to compile.

I tried import Pouchdb = require('pouchdb');, result :

ERROR in src/app/services/pouchdb.service.ts(4,1): error TS1202: Import assignment cannot be used when targeting ECMAScript modules. Consider using 'import * as ns from "mod"', 'import {a} from "mod"', 'import d from "mod"', or another module format instead.

I tried import * as PouchDB from 'pouchdb';, result

[ng] ERROR in ./node_modules/pouchdb/lib/index-browser.js
[ng] Module not found: Error: Can't resolve 'vuvuzela' in 'C:\Users\User\PROG\toto\node_modules\pouchdb\lib'

I also use pouchdb-find, and tried import * as PouchDB_Plugin_Find from 'pouchdb-find';, got

[ng] ERROR in src/app/services/pouchdb.service.ts(5,1): error TS7038: A namespace-style import cannot be called or constructed, and will cause a failure at runtime.
[ng] src/app/services/pouchdb.service.ts(122,21): error TS2351: Cannot use 'new' with an expression whose type lacks a call or construct signature.
[ng] src/app/services/pouchdb.service.ts(123,22): error TS2351: Cannot use 'new' with an expression whose type lacks a call or construct signature.
[ng] Date: 2018-10-16T12:33:21.375Z - Hash: 9ac23b4a3f0e799c86ef - Time: 8225ms
[ng] 173 unchanged chunks
[ng] chunk {home-home-module} home-home-module.js, home-home-module.js.map (home-home-module) 654 kB  [rendered]
[ng] ERROR in ./node_modules/pouchdb/lib/index-browser.js
[ng] Module not found: Error: Can't resolve 'vuvuzela' in 'C:\Users\User\PROG\toto\node_modules\pouchdb\lib'

I have no idea what’s going on ?

2

The same here, I was trying to migrate to ionic 4, anyone from the dev team?

@trollanfer did you find solution?

3

Yes :

const PouchDB = require('pouchdb').default;
const PouchDB_Plugin_Find = require('pouchdb-find').default;

But I got errors afterwards (because of that???)…
I remember I had to insert this line in polyfill.ts :

(window as any).global = window;

I don’t understand these tweaks, and I have been struggling for too long with it.

For now, I just to decided give up switching to ionic 4 : too many problems, what for ? My V3 app works…Good luck!

4

Hi,

I am using ionic v4.12 for a pwa and I use pouch as follows:

import PouchDB from ‘pouchdb’;
import PouchDbFind from ‘pouchdb-find’;
PouchDB.plugin(PouchDbFind);

and it works fine.
I hope that helps,
Htg.

1 Like
5

l think I already find a way.
According to this https://pouchdb.com/guides/setup-pouchdb.html#typescript

you just need to add "allowSyntheticDefaultImports": true in your tsconfig then you can import pouchdb using this import PouchDB from 'pouchdb';

so far on my initial test, it works just fine and syncing.

1 Like
6

Hi gilcon,

Interesting, I checked my tsconfig.json and do not have “allowSyntheticDefaultImports”, but it works fine - syncing included.

At least you have it working now!

Htg.