App crashes on initilization

[ullalaaron]

I've inserted the following lines in my

app.js

var fresco = require("nativescript-fresco");

if(application.android){
application.onLaunch = function(intent){
fresco.initialize();}
}

However , as soon as I start the app I get the following stacktrace:

java.lang.RuntimeException: Unable to create application com.tns.NativeScriptApplication: com.tns.NativeScriptException: 
Fail to load module: /data/data/org.nativescript.haloose/files/app/app.js

TypeError: Cannot read property 'AnimatedDrawable' of undefined
File: "<unknown>, line: 1, column: 265

StackTrace: 
    Frame: function:'', file:'/data/data/org.nativescript.haloose/files/app/tns_modules/nativescript-fresco/nativescript-fresco.js', line: 35, column: 43
    Frame: function:'require', file:'', line: 1, column: 266
    Frame: function:'', file:'/data/data/org.nativescript.haloose/files/app/app.js', line: 4, column: 14
    Frame: function:'require', file:'', line: 1, column: 266

This is very weird because it was working before. After a reinstall of the app however, I got the error above.
What is causing this?

[VladimirAmiorkov]

Hi @ullalaaron ,

I tried to reproduce the issue in a fresh project but to no avail. The {N} project was build and deployed on the emulator and device successfully and the FrescoDrawee was correctly loaded with the imageUri.

Could you share how your project's XML is setup, maybe there is some layout issues?

[leocaseiro]

Hi @ullalaaron and @VladimirAmiorkov,

I'm having the same issue.

I started a new Angular App from the tns-template-hello-world-ng and I installed nativescript-fresco.

Perhaps is something related with Android version or the Fresco version.

These are my steps:

tns create myapp --template tns-template-hello-world-ng
cd myapp
tns platform add android
tns plugin add nativescript-fresco

Then, I added to my main.ts:

import application = require("application");
import fresco = require("nativescript-fresco");

if (application.android) {
    application.onLaunch = function(intent) {
        fresco.initialize();
    };
}

So I run the app:

tns run android --emulator

on my logs, I noticed that it's downloading the fresco@0.9.0:

Download https://jcenter.bintray.com/com/facebook/fresco/drawee/0.9.0/drawee-0.9.0.pom
Download https://jcenter.bintray.com/com/facebook/fresco/fbcore/0.9.0/fbcore-0.9.0.pom
Download https://jcenter.bintray.com/com/facebook/fresco/imagepipeline/0.9.0/imagepipeline-0.9.0.pom
Download https://jcenter.bintray.com/com/parse/bolts/bolts-android/1.1.4/bolts-android-1.1.4.pom
Download https://jcenter.bintray.com/com/facebook/fresco/imagepipeline-base/0.9.0/imagepipeline-base-0.9.0.pom
Download https://jcenter.bintray.com/com/facebook/fresco/fbcore/0.9.0/fbcore-0.9.0.aar
Download https://jcenter.bintray.com/com/facebook/fresco/drawee/0.9.0/drawee-0.9.0.aar
Download https://jcenter.bintray.com/com/parse/bolts/bolts-android/1.1.4/bolts-android-1.1.4.jar
Download https://jcenter.bintray.com/com/facebook/fresco/imagepipeline-base/0.9.0/imagepipeline-base-0.9.0.aar
Download https://jcenter.bintray.com/com/facebook/fresco/imagepipeline/0.9.0/imagepipeline-0.9.0.aar
Download https://jcenter.bintray.com/com/facebook/fresco/fresco/0.9.0/fresco-0.9.0.aar

So it worked perfectly.

Then, I installed the nativescript-web-image-cache because is the best one for iOS which also comes with Fresco(but doesn't work well). So I got the same bug.

I fixed setting both dependencies up to be 0.9.0+ on each include.gradle:

dependencies {
    compile "com.facebook.fresco:fresco:0.9.0+"
}

PS: In case you want to test with Angular, make sure you register the element:

import {registerElement} from "nativescript-angular/element-registry";
registerElement("FrescoDrawee", () => require("nativescript-fresco").FrescoDrawee);

I'm still figuring out the best fix because this one is a hack.

[VladimirAmiorkov]

Hi @leocaseiro ,

Thank you for the detailed report. Indeed this issue comes from the two plugins not being comparable since they depend on a different version of the Android Fresco library. Unfortunately as they are separate plugins targeting the same native Android library there isn't a way to unify which version of the android library should be coped to the build {N} project. The solution is as you have made in your forked version to unify both plugins to depend on the same version of the Fresco library.

We are always looking of ways to improve the nativescript-fresco {N} plugin and adding support for iOS is our top priority feature. As the issue of "managing images in the memory" is not such great one on iOS there isn't an appropriate library that could match 100% of what Android's Fresco library has which is why the 1.0.0 version shipped without iOS support. Keep your eyes on the npm/github pages of the nativescript-fresco for future improvements.

[leocaseiro]

Hi @VladimirAmiorkov, thank you for your reply.

I was wondering why you are not using the newest version for nativescript-fresco?

Is there something that is incompatible on the new version of fresco?

[VladimirAmiorkov]

@leocaseiro I have't tested the latest version of the Android Fresco as I have not seen anything interesting in the release notes of that version, but it is an option that I should and will explore in the future.

Have in mind that there will 'always' be a newer version of an native library that is a dependency of an {N} plugin. This is an bigger issue that unfortunately cannot be resolved on plugin-wise level. The best way of avoiding such issues in the future is to have in mind which plugins your {N} project is using and their native dependencies and if there are multiple plugins using the same native library but from different versions, change them in such a way that they match. In most cases there shouldn't be multiple {N} plugins that use the same native library but it is always a possibility.

[leocaseiro]

Thanks again!

I'm aware that will always be a newer version. I know in ios we can setup a Pod without each version. so it's always having the new one.

Well, I'll be using my version of the image cache for ios atm and try let same version as this repo.

Cheers!

Can someone help me here? My issue is a bit similar:

So, I installed nativescript-fresco and followed the instruction on the readme and this is what I'm getting when running tns run android:

System.err:
System.err: Error calling module function
System.err:
System.err: Error calling module function
System.err:
System.err: Error calling module function
System.err:
System.err: Error calling module function
System.err:
System.err: Error calling module function
System.err:
System.err: TypeError: Cannot read property 'base' of undefined
System.err: File: "file:///data/data/org.nativescript.MovieDB/files/app/tns_modules/nativescript-fresco/nativescript-fresco.js, line: 92, column: 37
System.err:
System.err: StackTrace:
System.err:     Frame: function:'', file:'file:///data/data/org.nativescript.MovieDB/files/app/tns_modules/nativescript-fresco/nativescript-fresco.js', line: 92, column: 38
System.err:     Frame: function:'require', file:'', line: 1, column: 266
System.err:     Frame: function:'', file:'file:///data/data/org.nativescript.MovieDB/files/app/tns_modules/nativescript-fresco/angular/nativescript-fresco.module.js', line: 6, column: 10
System.err:     Frame: function:'require', file:'', line: 1, column: 266
System.err:     Frame: function:'', file:'file:///data/data/org.nativescript.MovieDB/files/app/tns_modules/nativescript-fresco/angular/index.js', line: 6, column: 10
System.err:     Frame: function:'require', file:'', line: 1, column: 266
System.err:     Frame: function:'', file:'file:///data/data/org.nativescript.MovieDB/files/app/app.module.js', line: 19, column: 17
System.err:     Frame: function:'require', file:'', line: 1, column: 266
System.err:     Frame: function:'', file:'file:///data/data/org.nativescript.MovieDB/files/app/main.js', line: 5, column: 20
System.err:     Frame: function:'require', file:'', line: 1, column: 266

Im using the plugin in an angular project by the way..