[Solved] Uncaught Invalid provider - only instances of Provider and Type are allowed, got: undefined

Ionic Framework ionic-v3
1

Hey All,

I’m going a bit nuts trying to figure this error out.

My Ionic2 app compiles fine. No errors.

However, the browser gives me the error

Uncaught Invalid provider - only instances of Provider and Type are allowed, got: undefined

And I obviously get a blank screen.

Now the error is happening because one of my providers given in IonicBootsrap is apparently undefined.

And using the debugger I see that indeed my provider has the value undefined.

What I can’t understand is WHY that provider is undefined.

This is my bootstrap

ionicBootstrap(BudgetApp, [
  PersistenceProviderManager
]);

This is my class

import {Injectable} from '@angular/core';
@Injectable()
export class PersistenceProviderManager  {
    constructor() {
    }
}

There is some other methods, but I didn’t think relevant

Any help appreciated

Thanks!

3

I think @App was replaced with @Component

4

I deleted the file and re-created it. Now it is working. But another provider is not working anymore in modals. It is working when not used in modals.

I think it must be some sort of filesystem, project configuration or compiler issue.

5

Oh I think I’ve figured it out.

I found an unused import and it partially solved the issue.

But I think it is due to a circular dependency.

I come from a Java background and it would be fine there. But seems like typescript / angular does not like it.

It isn’t a circular dependency in DI, it is simply a reference from a service to a class that it is later injected into.

Shouldn’t be too much trouble to fix it.

Tentatively marked as solved :slight_smile:

1 Like
7

You actually should not be declaring providers there.

They need to be declared in the bootstrap declaration, like vanilla angular 2 app.

8

Like @ryanhow displayed then?

ionicBootstrap(BudgetApp, [
PersistenceProviderManager
]);

9

Yep, that is where providers should be declared to make them accessible at the global level.

10

I feel like my all life is a lie…thx for the input

11

@reedrichards There there pats on the back. I know the feeling! Make sure you keep up with the release notes for each beta. I’ve been caught out a few times!

1 Like
12

I was facing the same issue. I have also declared the providers in
ionicBootstrap(app,[service1,service2,service3]).

But now i get the error saying:
“Uncaught: Invalid provider - only instances of Provider and Type are allowed, got: undefined”.

Any suggestions for this?

13

There could be a lot of causes.

I found I had circular dependencies in my code which ended up causing this issue.

I still get this error from time to time though, I suspect I still have a circular dependency somewhere I haven’t cleared up and depending on how the compiler handles it, I get the error.

For me it was a bit of a process of elimination. When I introduced a particular class then I got this issue. When I removed the class everything worked fine.

It was a very frustrating issue.

I’m planning on moving my code over to RC1 when it is released and sorting out the issue once and for all by breaking the code into modules.

14

Well seems like i couldn’t figure out the root cause of the problem, but i could definitely fix it by just renaming one of my service file which was getting undefined in the ionicBootstrap Method.