Cordova app cannot load any files in assets/www (only index.html)

Question

I'm compiling a very simple Cordova app and deploying on Android. I want to test the smoothness of jQuery Mobile on various Android devices, so I'm compiling an app with the contents of the jQuery Mobile demo folder.

I created a new Cordova project and placed the contents of jQuery Mobile demo folder into my www folder.

I then used the Cordova binary to add the android platform, ran cordova build, and finally cordova run android.

The application opened on my phone, but no files other than the index.html will load. I connected up the app to the Chrome Inspector debugger to see what wasn't loading, here's what I saw:

All of the files that Cordova can't find, do exist in platforms/android/assets/www. Cordova can find index.html just find, but it cannot load anything else.

If I open that folder in a web browser, everything loads just fine.

Anyone know what could be causing this issue or what steps I might take to further troubleshoot and isolate the issue? I've Googled for hours and I cannot find anyone else facing a situation quite like this. For other people, it's the index.html file that won't load or they simply forgot to add the files they want into the www folder. In my case, index.html loads fine, but nothing else will (see screenshot above).

Here is my config.xml (mostly just the standard default):

<?xml version='1.0' encoding='utf-8'?>
<widget id="com.rand.jqmdemo" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>jqmdemo</name>
    <description>
        A sample Apache Cordova application that responds to the deviceready event.
    </description>
    <author email="[email protected]" href="http://cordova.io">
        Apache Cordova Team
    </author>
    <content src="index.html" />
    <plugin name="cordova-plugin-whitelist" spec="1" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <platform name="android">
        <allow-intent href="market:*" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
    </platform>
    <engine name="android" spec="~4.1.1" />
</widget>

Here is my AndroidManifest.xml file:

<?xml version='1.0' encoding='utf-8'?>
<manifest android:hardwareAccelerated="true" android:versionCode="1" android:versionName="0.0.1" package="com.elliot.jqmdemo" xmlns:android="http://schemas.android.com/apk/res/android">
    <supports-screens android:anyDensity="true" android:largeScreens="true" android:normalScreens="true" android:resizeable="true" android:smallScreens="true" android:xlargeScreens="true" />
    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
    <application android:hardwareAccelerated="true" android:icon="@drawable/icon" android:label="@string/app_name" android:supportsRtl="true">
        <activity android:configChanges="orientation|keyboardHidden|keyboard|screenSize|locale" android:label="@string/activity_name" android:launchMode="singleTop" android:name="MainActivity" android:theme="@android:style/Theme.Black.NoTitleBar" android:windowSoftInputMode="adjustResize">
            <intent-filter android:label="@string/launcher_name">
                <action android:name="android.intent.action.MAIN" />
                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>
    <uses-sdk android:minSdkVersion="14" android:targetSdkVersion="22" />
</manifest>

Here is my index.html file: http://pastebin.com/duFSLT5T

Answer 1

I eventually figured this out. It's a Cordova issue while deploying with Android. Any folders that begin with an underscore are omitted without warning. It looks like the bug has been around for over 5 years and with no sign of getting fixed soon:

https://code.google.com/p/android/issues/detail?id=5343

Answer 2

If your files are in documents->jqdemo->www , like you show on pasteboard.co, then your files are in the wrong place.

They have to be in:

your_cordova_project->platforms->android->assets->www

To do so:

Include the assets, index.html, js only in the root folder of your cordova project and then do a cordova build and don't change the platform www folder by yourself.

If you are coding and not just testing, the better way is to have symlinks or pre-scripts, which do the copy job. So you don't have to call every time cordova build.

jQuery Mobile: It runs very well on mobile devices, if you know what you are doing. Otherwise it is very easy to slow down your app. So, be careful!

Update:

Interesting problem and I stay on it, that the path is not correct, maybe not resolvable. So, try this things:

1. Create a new css file, name test.css and content:

body {
   background-color: red !important;
   font-size: 3em !important;
}

Put this file in the root of your www folder, link it in your html-file and make a cordova build. Do you see the file in the platform www-folder?

How does it affect on your device?