[SOLVED] [V2] White Screen in APK

Hello everyone!!

I’m working on the template cordova-template-framework7-vue-webpack

I had to change the layout structure to keep the pages on the stack.

This change produced that when I generate the APK doing “cordova build android”, the application starts but it shows a blank screen without being able to take any action.
It should be noted that doing “cordova run android - --lr” the application runs correctly on the device.

From the Chrome Inspect tool I can see that the application and its components are loaded correctly as shown in the following image:


In addition, the debug tool does not show error messages.

I have tried different alternatives to solve it seeing post of similar characteristics but I did not find a solution for this specific case.

Next I leave a small example of how is the structure of my App.

Main.vue
https://pastebin.com/RF0G2A6W

Routes.js
https://pastebin.com/zNsPfbip

news.vue
https://pastebin.com/HLzL9H6i

Would someone be so kind to help me?
Thank you very much.

Remove “stacked” prop from your initial page, I guess it is a page-news

1 Like

Wow great! I had more than a week with this topic and you solved it.
Thank you very much Vladimir.
Regards!

Hello @nolimits4web .

I’ll bother you again with a question related to this topic.

After removing the stacked property from the initial page, the path that appears inside router.currentRoute is “/android_asset/www/index.html” when “/” should appear, once I go to another page the indicated path is the right one. Also, no page has the “page-current” class until I move to another page.
This means that the initial page (news.vue path “/”) is not inside the DOM when the Application starts?

Would you be so kind to help me with this issue? Anyway, I appreciate your time and predisposition.

Regards, Fabricio.

You have to tell to View which one is default route on its init:

<f7-view id="main-view" :stackPages="true" main url="/">
1 Like

Thank you Vladimir, your work is impeccable.

A million thanks!

Have a nice Week, regards!

Hello!

Maybe i can get some help here…

I’m building my first app Using F7 and Cordova… it’s being great building and running on the navigator.

The problem is:

When i install the APP generated by cmd “cordova build android” it’s just a white screen BUT when i run the app using “npm start” on PC i see this: (my app)

This is my Index.html

Imgur

This is my routes.js

Imgur

My app.vue:

Imgur

And How the folders are:

Imgur

i cant find the solution… i really need help.

Thanks for reading and sorry for asking here!

Hi @Mateo_Tozzini

Try with “npm run build-dev-cordova” or “npm run build-prod-cordova” if you build to production.

You can see the commands by FWK7 in package.json “scripts” section.

1 Like

Oooooh i was copy-pasting the F7 code into the www folder.

Now i run “npm run build-dev-cordova” and THOSE files are the one that should go inside www folder…

That works perfectly.
Thanks, u save me A LOT of time Fabricio.

Thanks. (sorry for the bad english).

Thanks again!

2 Likes

Even after running npm run build-cordova-android, I still get white screen after screnn splash. Can anyone help me with the solution

Sorry was using an old template