native modules are not working correctly in nativescript

Issue

I am trying to use this android package to make a blur effect in nativescript.

https://github.com/wasabeef/Blurry

so in nativescript included the compile in my app.gradle in the /app/App_Resources/Android/app.gradle

then rebuild everything works good and builds great.

but when I start to use the library I tried to console.dir(global[‘jp’])
since the library import statement should be

import jp.wasabeef.blurry.Blurry;

so I am starting to see if the functions am going to call exists so this what comes up from console.dir

JS: === dump(): dumping members ===
JS: {
JS:     "wasabeef": {
JS:         "blurry": {
JS:             "R": "R()function () { [native code] }"
JS:         }
JS:     }
JS: }
JS: === dump(): dumping function and properties names ===
JS: === dump(): finished ===

so , as you can see that the last function that should make me access the library does not exist.
I really want to know why I also tried to make an android package myself to use that will return me the function I want but same issue the last function does not appear.

I have also searched for a plugin in nativescript I found this one https://www.npmjs.com/package/nativescript-blur

but , it actually dont make actual blur as said in the docs and when I tried to use it same issue happened and I got this error.

JS: ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'init' of undefined
JS: TypeError: Cannot read property 'init' of undefined
JS:     at new Blur (file:///data/data/org.nativescript.test2/files/app/tns_modules/nativescript-blur/blur.js:8:39)
JS:     at Object.<anonymous> (file:///data/data/org.nativescript.test2/files/app/home/home.component.js:5:12)
JS:     at require (<anonymous>:1:266)
JS:     at Object.<anonymous> (file:///data/data/org.nativescript.test2/files/app/home/home-routing.module.js:5:24)
JS:     at require (<anonymous>:1:266)
JS:     at Object.<anonymous> (file:///data/data/org.nativescript.test2/files/app/home/home.module.js:5:29)
JS:     at require (<anonymous>:1:266)
JS:     at file:///data/data/org.nativescript.test2/files/app/tns_modules/tns-core-modules/globals/globals.js:92:32
JS:     at new ZoneAwarePromise (file:///data/data/org.nativescript.test2/files/app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:777:29)
JS:     at Object.import (file:///data/data/org.nativescript.test2/files/app/tns_modules/tns-core-modules/globals/globals.js:90:16)
JS:     at SystemJsNgModuleLoader.loadAndCompile (file:///data/data/org.nativescript.test2/files/app/tns_modules/@angular/core/bundles/core.umd.js:6596:29)
JS:     at SystemJsNgModuleLoader.load (file:///data/data/org.nativescript.test2/files/app/tns_modules/@angular/core/bundles/core.umd.js:6580:60)
JS:     at RouterConfigLoader.loadModuleFactory (file:///data/data/org.nativescript.test2/files/app/tns_modules/@angular/router/bundles/router.umd.js:4611:72)
JS:     at RouterConfigLoader.load (file:///data/data/org.nativescript.test2/files/app/tns_modules/@angular/router/bundles/router.umd.js:4591:52)
JS:     at MergeMapSubscriber.project (file:///data/data/org.nativescript.test2/files/app/tns_modules/@angular/router/bundles/router.umd.js:2083:74)

so , when I checked the place of the error in the node_modules I found out the init was the last function in the package name that the library was using same case with the package I was trying to use above.

  • Also I have tried this in the angular blank template and in the javascript blank template assuming there were any difference while including the libraries globally.

  • my nativescript cli version is : 3.4.3

  • I was using an emulator with android version 6

I don’t know why this weird issue is happening am new to nativescript. Please I need someone to tell me how to solve this issue or at least just answer with an example app that uses the package I mentioned above.

Thanks

Solution

I have found out the answer was that weirdly when nativescript rebuild for some reason it does not build it correctly.
so , as this issue https://github.com/davecoffin/nativescript-blur/issues/5
solution said

you just need to :

do

tns platform remove android

then do

tns run android

and that’s it should be working properly now. hope it helps who ever meets such an error

Answered By – ElGenius

Answer Checked By – Terry (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.