Invalid provider - only instances of Provider and Type are allowed, got: [object Object]


I recreated the project using a blank template. Creating the pages, services, models etc and copying over the code from the previous project. I have added in the dependancies as far as I can see. I have uploaded to ionic view. Running the ionic serve has an issue. Is this something obvious to fix?

Thanks for your help - Ben

output from running ionic serve

Tue Aug 01 19:07: $|-bash|~/Documents/Udemy/IonicAngular/UpdatedRecipeMobile >> ionic serve
[INFO] Starting app-scripts server: --port 8100 --p 8100 --livereload-port 35729
       --r 35729 --address - Ctrl+C to cancel
[19:08:16]  watch started ... 
[19:08:16]  build dev started ... 
[19:08:16]  clean started ... 
[19:08:16]  clean finished in 5 ms 
[19:08:16]  copy started ... 
[19:08:16]  transpile started ... 
[19:08:21]  transpile finished in 5.68 s 
[19:08:21]  preprocess started ... 
[19:08:21]  deeplinks started ... 
[19:08:21]  deeplinks finished in 48 ms 
[19:08:21]  preprocess finished in 49 ms 
[19:08:21]  webpack started ... 
[19:08:23]  copy finished in 7.50 s 
[19:08:40]  webpack finished in 18.49 s 
[19:08:40]  sass started ... 
[19:08:42]  sass finished in 2.55 s 
[19:08:42]  postprocess started ... 
[19:08:42]  postprocess finished in 5 ms 
[19:08:42]  lint started ... 
[19:08:42]  build dev finished in 26.88 s 
[19:08:43]  watch ready in 27.29 s 
[19:08:43]  dev server running: http://localhost:8100/ 

[INFO] Development server running
       Local: http://localhost:8100
[19:08:52]  lint finished in 9.32 s

but the web page is showing the following error.

Runtime Error
Invalid provider - only instances of Provider and Type are allowed, got: [object Object]
Error: Invalid provider - only instances of Provider and Type are allowed, got: [object Object]
    at invalidProviderError (http://localhost:8100/build/vendor.js:1854:12)
    at http://localhost:8100/build/vendor.js:2714:19
    at Array.forEach (<anonymous>)
    at _normalizeProviders (http://localhost:8100/build/vendor.js:2703:15)
    at http://localhost:8100/build/vendor.js:2711:13
    at Array.forEach (<anonymous>)
    at _normalizeProviders (http://localhost:8100/build/vendor.js:2703:15)
    at resolveReflectiveProviders (http://localhost:8100/build/vendor.js:2654:39)
    at Function.ReflectiveInjector.resolve (http://localhost:8100/build/vendor.js:2883:16)
    at Function.ReflectiveInjector.resolveAndCreate (http://localhost:8100/build/vendor.js:2915:79)
Ionic Framework: 3.6.0
Ionic Native: ^2.9.0
Ionic App Scripts: 2.1.3
Angular Core: 4.1.3
Angular Compiler CLI: 4.1.3
Node: 8.2.1
OS Platform: macOS Sierra
Navigator Platform: MacIntel
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.115 Safari/537.36

Ionic info

Tue Aug 01 19:10: $|-bash|~/Documents/Udemy/IonicAngular/UpdatedRecipeMobile >> ionic info

cli packages:

@ionic/cli-plugin-cordova       : 1.5.0 (/Users/bendeverell/Documents/Udemy/IonicAngular/UpdatedRecipeMobile/node_modules/@ionic/cli-plugin-cordova)
@ionic/cli-plugin-ionic-angular : 1.4.0 (/Users/bendeverell/Documents/Udemy/IonicAngular/UpdatedRecipeMobile/node_modules/@ionic/cli-plugin-ionic-angular)
@ionic/cli-utils                : 1.6.0 (/Users/bendeverell/Documents/Udemy/IonicAngular/UpdatedRecipeMobile/node_modules/@ionic/cli-utils)
ionic (Ionic CLI)               : 3.6.0 (/Users/bendeverell/Documents/Udemy/IonicAngular/UpdatedRecipeMobile/node_modules/ionic)

global packages:

Cordova CLI : 7.0.1 

local packages:

@ionic/app-scripts : 2.1.3
Cordova Platforms  : android 6.2.3 ios 4.4.0
Ionic Framework    : ionic-angular 3.6.0


Node       : v8.2.1
OS         : macOS Sierra
Xcode      : Xcode 8.3.3 Build version 8E3004b 
ios-deploy : 1.9.1 
npm        : 5.3.0

The error suggests you have an improper provider declared somewhere. Look where providers are declared. I would start with the app module.

Its a very simple app. I can not see anything obvious in the declarations and this compiled before in an earlier incarnation of ionic 2. Thank you for your suggestion. - Ben

Yeah, but beta5 was a really long time ago. Quite possible that Angular and even Typescript were different back then. Look at the providers, maybe missing an annotation or something?

Yes I agree. I imported the browser and http modules into app component with the providers and the splash screen + bar native for Ionic 3x. I will spend some times going through it line by line. Cheers - When I have the solution I will post - cheers

1 Like

@Bendeverell did you came up with something? :slight_smile:

Hi Lucy

I’ve been side tracked for a few days. I will look at it early next week. Shouldn’t be too difficult. Will post what I needed to change to make it work


Ok, looking forward… I have removed all my code… only basic structure of ionic app remained and still getting the error :smile: