Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Promise.resolve() is not a function error angular 4 #86

Open
lakinmohapatra opened this issue Sep 7, 2017 · 25 comments
Open

Promise.resolve() is not a function error angular 4 #86

lakinmohapatra opened this issue Sep 7, 2017 · 25 comments

Comments

@lakinmohapatra
Copy link

I am using this library as

import Relational from 'relational-pouch';
PouchDB.plugin(Relational);

Its showing Promise.resolve() is not a function console error.

Please help.

@EvansMatthew97
Copy link

To get around this problem I commented out line 3 in lib/pouch-utils.js

'use strict';

//var Promise = require('pouchdb-promise'); <-- commented out
/* istanbul ignore next */
exports.once = function (fun) {

Not sure what the actual problem is, though.

@dmitri-wm
Copy link

dmitri-wm commented Oct 13, 2017

Same problem with angular 4 and ionic 2. @MrPutuLips comment helps, but it's not a good idea to comment out script :)
code sample which causes this error


import { Injectable } from '@angular/core';
import PouchDB from 'pouchdb';
import * as cordovaSqlitePlugin from 'pouchdb-adapter-cordova-sqlite';
import * as relationalPouch from 'relational-pouch'

@Injectable()

export class DbConnector{
  private db = null;

  public connect(){
    PouchDB.plugin(cordovaSqlitePlugin);
    PouchDB.plugin(relationalPouch);
    PouchDB.debug.enable('*');

    this.db = new PouchDB('gre-app');
    this.setSchema();
  }

  private setSchema() {
    this.db.setSchema([
        { singular: 'department', plural: 'departments' }
      ])
  }

  public getDb(){
    return this.db
  }
}

@dmitri-wm
Copy link

dmitri-wm commented Oct 14, 2017

Think found where exactly issue is.
Here is used CommonJs require https://github.com/pouchdb-community/relational-pouch/blob/master/lib/pouch-utils.js#L3
And 'pouchdb-promise' which is required written with ES6 and exported as default.

So proper syntax will be
not

var Promise = require('pouchdb-promise')
but
var Promise = require('pouchdb-promise').default;

I saw there is https://github.com/59naga/babel-plugin-add-module-exports but can't setup it so it could help here.

Any ideas?

@lakinmohapatra did you sort out issue?

@danobot
Copy link

danobot commented Oct 23, 2017

Facing this same problem.

@broerse
Copy link
Collaborator

broerse commented Jan 11, 2018

We updated pouchdb-promise to the newest version in v3.0.0

We like to know if this solves this issue.

@Prabuganesan
Copy link

I have update version 3.0.0. But still this issue not solved.

@broerse
Copy link
Collaborator

broerse commented Jan 18, 2018

@Prabuganesan Thanks for testing. I will try to understand what is wrong. I don't use Angular and Ember is not showing this error so not sure where the bug is coming from.

@humbertocruz
Copy link

Here too with NextJS

@jlami
Copy link
Collaborator

jlami commented Jan 22, 2018

@dmitri-wm is correct. This module is not ES6 yet and should respect the fact that pouchdb-promise is. So a .default after the require is the correct way to go for now.

@jlami
Copy link
Collaborator

jlami commented Jan 23, 2018

I think this is a transpile problem. Our tests wont work with .default and the browserified version in /dist should also be correct without it.

But since ES6 is the future, it might be a good idea to rewrite this whole plugin and setup js:next in package.json which should help those that expect ES6 modules. Otherwise the babel plugin that @dmitri-wm mentioned seems good

I saw there is https://github.com/59naga/babel-plugin-add-module-exports but can't setup it so it could help here.

But I don't know anything about angular and how it transpiles, so I'm sorry I can't help there.

@tim-field
Copy link

Same issue in a React project using Create React App

@tim-field
Copy link

This might be a silly question but can't we just rely on native promises now ?
https://github.com/pouchdb-community/relational-pouch/blob/master/lib/pouch-utils.js#L3 ( just removing this line fixes everything up for me )

If you don't have promise support in your target build in 2018 then chances are that you are already polyfilling them earlier in your build step ?

@luca147
Copy link

luca147 commented Apr 30, 2018

The only solution is changing relational-pouch/lib/pouch-utils.js line 3: var Promise = require('pouchdb-promise');

to this: var Promise = require('pouchdb-promise').default;

????

Thanks!

@Prabuganesan
Copy link

Prabuganesan commented Apr 30, 2018 via email

@luca147
Copy link

luca147 commented Apr 30, 2018

: ( very bad....

how can we work with this solution, so that all the members of the team can have that change without needing to modify it each one of them???

@luca147
Copy link

luca147 commented May 9, 2018

Well i decided i will not use this plugin, it have lot of bugs, i think use only pouch is more efficient.
Thanks

@509dave16
Copy link

@luca147 You will need to create a fork of this repo and modify it yourself to have the change like what @rwein did in his fork: https://github.com/rwein/relational-pouch/commit/6b525a3ca3eea891a4a12c3b195e7c730be67e80

Then install the package using the github repo.

Or simply use the fork I pointed out in the link above.

This way you and all your team members should have the change.

@luca147
Copy link

luca147 commented May 14, 2018

@509dave16 thx man, I decided not to use the plugin, as I told you in the other thread.. thx a lot

@liquid36
Copy link

liquid36 commented Jun 25, 2018

I made a webpack alias to the browser version file. Like this:

alias: {
  'pouchdb-promise': path.join(__dirname, '../node_modules/pouchdb-promise/lib/index.js')
},

@fpfarina
Copy link

@liquid36 good solution!! What it's great, no need to fork or make changes to the source code! Thx!

@p4bl1t0
Copy link

p4bl1t0 commented Jun 25, 2018

@liquid36 where do you put that alias?

@liquid36
Copy link

Here!
It's depends on your webpack configurations.

@freddydrodev
Copy link

@liquid36 where do you put that alias?

Hi guy I know it's a bit late but I have just faced the issue and base on #86 (comment). This is how I have managed:
I am using create-react-app
I have installed react-app-rewired react-app-rewire-aliases in order to be able to modify it. check the docs for more info:

yarn add react-app-rewired react-app-rewire-aliases -D

but basicaly this is the code to put in config-overrides.js in your root folder

const rewireAliases = require("react-app-rewire-aliases");
const path = require("path");

module.exports = function override(config, env) {
  config = rewireAliases.aliasesOptions({
    "pouchdb-promise": path.join(
      __dirname,
      "/node_modules/pouchdb-promise/lib/index.js"
    )
  })(config, env);

  return config;
};

@easychen
Copy link

@liquid36 where do you put that alias?

Hi guy I know it's a bit late but I have just faced the issue and base on #86 (comment). This is how I have managed:
I am using create-react-app
I have installed react-app-rewired react-app-rewire-aliases in order to be able to modify it. check the docs for more info:

yarn add react-app-rewired react-app-rewire-aliases -D

but basicaly this is the code to put in config-overrides.js in your root folder

const rewireAliases = require("react-app-rewire-aliases");
const path = require("path");

module.exports = function override(config, env) {
  config = rewireAliases.aliasesOptions({
    "pouchdb-promise": path.join(
      __dirname,
      "/node_modules/pouchdb-promise/lib/index.js"
    )
  })(config, env);

  return config;
};

this works for me . if you use customize-cra , config-overrides.js might like this :


const {
    override,
   ...,
    addWebpackAlias
  } = require("customize-cra");

const path = require("path");
  
  module.exports = {
    webpack: override(
        addWebpackAlias({"pouchdb-promise": path.join(
          __dirname,
          "/node_modules/pouchdb-promise/lib/index.js"
        )})
    )
  };

EnricoVogt added a commit to EnricoVogt/relational-pouch that referenced this issue Jun 23, 2019
@twincle
Copy link

twincle commented Feb 14, 2020

Here's a workround:

    const utils = require('relational-pouch/lib/pouch-utils.js');
    utils.Promise = window.Promise;
    PouchDB.plugin(require('relational-pouch'));

You can manully change the default Promise object before PouchDB plugin it.
This is because angular uses ZoneAwarePromise as the default Promise.
Normally, it will work fine. But in some unknown (just I don't know) reasons, ZoneAwarePromise become a module with a default property who wraps the real ZoneAwarePromise Object.

@jlami jlami mentioned this issue Mar 4, 2020
jlami added a commit that referenced this issue Mar 4, 2020
Big rewrite to prepare for future changes. This now uses Typescript and Webpack to build everything.
Some breaking changes to eliminate extend usage.
Supersedes #116 and thus should also solve #86
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests