App.bundle.js not found

Hi, I’ve got a big problem on my project.
I am writing a test app with in app purchases, using cordova-plugin-inapppurchase.

As this is a Cordova plugin I test my app on my Android phone. The plugin provides the inAppPurchase object for accessing the store and make purchases etc.

Here comes the error: When I try to use the inAppPurchase like

console.log(inAppPurchase);
the App won’t deploy due “file:///android_asset/www/build/js/app.bundle.js Failed to load resource: net::ERR_FILE_NOT_FOUND” error.

In the next step I didn’t use the inAppPurchase object anywhere in my app and deployed it on my smartphone. My app works as expected. Then I opened the chrome developer tools, connected my phone for debugging. I typed inAppPurchase into the console and had full access to the object.

Then I build the project for android one more time without using the inAppPurchase object, and manipulated the app.bundle.js by inserting a console.log(inAppPurchase) in my default page. Then I build and deployed the app via Android Studio and it worked!

My guess is that there is something wrong while ionic compiles the TypeScript. This is my first ionic app and I’m new to this so I don’t have the experience for digging deeper. Do you have a clue how I can solve this problem?

Thank you so much!

Run

ionic build

and check the output of your console.
Somewhere you may get an error with clear origin and message.

I love to use ionic serve for helping me out debugging :slight_smile:

1 Like

First, don’t run your app on a real device simultaneously with ionic serve. And secondly as @matheo pointed out, inspect the output of ionic build android or gulp build

Thank you for your replies.

I used ionic build android and it shows

Running 'build:before' gulp task before build
[13:43:35] Starting 'clean'...
[13:43:35] Finished 'clean' after 39 ms
[13:43:35] Starting 'build'...
[13:43:35] Starting 'sass'...
[13:43:35] Starting 'html'...
[13:43:35] Starting 'fonts'...
[13:43:35] Starting 'scripts'...
[13:43:35] Finished 'scripts' after 63 ms
[13:43:35] Finished 'html' after 69 ms
[13:43:35] Finished 'fonts' after 83 ms
[13:43:36] Finished 'sass' after 1.11 s
TypeScript error: /Users/cedric/Documents/workspace/testapp/app/pages/shop/shop.ts(23,17): Error TS2304: Cannot find name 'inAppPurchase'.
[13:43:39] Finished 'build' after 3.85 s
[13:43:39] Starting 'build:before'...
[13:43:39] Finished 'build:before' after 13 μs

It’s the same error that occurs with ionic serve.
On my local server (ionic serve) inAppPurchase is not available through console.
I didn’t use ionic serve much because I’ve read that cordova plugins are only available on devices but this might be a myth?

So all in all TypeScript doesn’t find inAppPurchase but it is accessible through console on device.
Any idea? :disappointed_relieved:

How are you importing and using inAppPurchase into Typescript?

I would do

ionic platform remove android
ionic platform add android
ionic plugin remove {the inapppurchase plugin name}
ionic plugin add {same plugin name}

basically that removes and reinstalls the plugin on android.

@matheo I don’t import it. Do I have to? I googled a lot and in most threads they say Cordova plugins can be added through ionic plugin add plugin-name and everything is done. Can you give me a hint how to import it correctly?

@itlr I don’t let anything untried so I tried your approach. No success :confounded: I also tried ionic state reset which removes and re-installs plugins and platforms. (I’ve got the plugin in config.xml so it will be reinstalled)

I don’t see inAppPurchase on ionic-native yet, so you don’t need to define it but be sure to use it after platform.ready()

So whats happening is because typescript doesn’t know about the code, it’s erroring out. What you could do is declare

declare var inAppPurchase:any;

This will by pass any type checking and allow things to compile.
I’m currently working on an ionic native wrapper for the inapppurchases plugin, so I’ll you know when it’s done.

1 Like