Deployed Build Not Rendering Custom Assets, Styles


#1

This is my first project using Ionic and am loving the built-in goodies. I participated in a hackathon this past weekend using Ionic/Cordova/Angular with the intention of deploying an app to either Android or iOS. We ran into issues when building and deploying. The build process went without a hitch, most of the time (for an unsigned .apk), but when opening the app on a device, none of our custom assets rendered (images, fonts, styles, maps embed). Also, I saved some data in a .json file that is returned by using Angular’s $http service, which did not render either. We used the Ionic tutorial to start a local Python server to do local testing/debugging and everything worked fine.

I can post screenshots/code, but I am wondering if there are any big steps that I’ve missed. My workflow to test the app on a device just included: ionic run android.

I customized my app based on the Ionic sidemenu template provided in the tutorial. Thanks in advance!


#2

I’d say something has to be off a bit. I’m working on a quick demo app for a talk tomorrow night. I’ve followed the “Getting Started” as the talk is an intro to Ionic.

I’m not doing anything special either. The app renders my own CSS just fine.

Any chance of you posting a quickie CodePen sample? If so, then I can use it locally and test on a device.


#3

I don’t mean to hijack this thread but this is the first time I’ve seen documented the behavior that I am experiencing deploying to Android 4.1.2 - 4.4.2 devices. Just like OP experienced my dynamically generated assets are displayed correctly in an emulator (Ripple) as well as locally served (nGinx). Everything works as expected. When I deploy to Android however any dynamically generated element isn’t displayed.

In my situation I am parsing a JSON file in a Service that provides a promised return which is being called from the page’s controller. In every instance where I’ve implemented with this strategy I have no elements being rendered on Android devices. I’ve used weinre on a Note 2 (n7105) with 4.4.2 and 4.1.2 to browse the DOM tree and the elements I expected to generated are there (items in List, Markers in Maps, etc). Should a directive be added to this workflow instead of solely using a service? Any insight would be appreciated…


#4

Including CrossWalk in my Android build solved all of these issues for me.


#5

I was actually wondering if having a promise for my json was part of the problem, until i noticed issues with my other files. I am deploying to a 4.4.2 device.


#6

Here is the actual repo if you’d like to take a look. Thanks!


#7

Thanks @catatonicrelaps. I’ll take a look at CrossWalk.


#8

I believe (and take my word with a grain or two of salt as I am brand new to the Angular world) that it is best practice to return a promise when rendering dynamic elements. I have tested my code against a Nexus (running 4.1.1), a Note 2 n7100 (running 4.1.2), and a Note 2 n7105 (running 4.4.2) and with Crosswalk I have had consistent and performant results. I am really pleased with Crosswalk’s inclusion in my stack.