2
votes

I'm trying to import PouchDB into my Angular application. I've tested differents import methods :

import PouchDB from 'pouchdb';
import * as PouchDB from 'pouchdb';

I am using it like below into a service :

database: PouchDB.Database = new PouchDB(DATABASE_URL);

If I do : import PouchDB from 'pouchdb', I get the following error message :

src/app/core/pouchdb/pouchdb.service.ts(3,8): error TS1192: Module '"{PATH_OF_PROJECT}/node_modules/@types/pouchdb/index"' has no default export.

If I do : import * as PouchDB from 'pouchdb', I get the following error message :

ERROR TypeError: PouchDB is not a constructor at new PouchDBService


Here are the versions of the different packages :

  • PouchDB : 6.4.3
  • @types/pouchdb : 6.3.2
  • Angular packages : 5.2.0
  • @angular/cli : 1.7.4

Thank you in advance for your answers.

2
what typescript version are you using? I could not reproduce the issue -> stackblitz.com/edit/angular-j8dk8h - Arikael
I'm using typescript 2.5.3. The only difference is that you use version 5.2.8 of Angular packages - Kevk
I changed the stackblitz to use 5.2.0 and typescript 2.5.3 (although I can't verify if it really uses 2.5.3) and it still works. have you recently updated some packages? Sometimes it helps to just delete the whole node_modules folder and run npm install again - Arikael
It's a new project so i didn't updated packages. I've already done the reinstallation of all node_modules. - Kevk
don't put your answer in the question--post it as an answer and accept it. - Flimzy

2 Answers

6
votes

Add "allowSyntheticDefaultImports": true in the compilerOptions section of your tsconfig.json

and use

import PouchDB from 'pouchdb';
1
votes

I had the same problem. But I solved it by adding the PouchDb cdn to my index.html page

<script src="//cdn.jsdelivr.net/pouchdb/6.4.3/pouchdb.min.js"></script>

And then after I used it in my code like this

declare const  PouchDB;

const _DB_ = new PouchDB('dbname');