CODEWITHSUNDEEP
androidcordova
David Limkys
David Limkys

Reputation: 5133

Cordova project works on browser but not in android

I'm having a strange problom where my cordova app on android fails to load js/css files where if I run in the browser It does not.

from remote debugging I got these error messages: file:///css/all.css Failed to load resource: net::ERR_FILE_NOT_FOUND file:///js/shims.js Failed to load resource: net::ERR_FILE_NOT_FOUND file:///js/app.js Failed to load resource: net::ERR_FILE_NOT_FOUND

Here is my project stracture

config.xml
www
   js
     jsFiles
   css
     cssFiles
   app
      more html files
   index.html

My index.html file looks like so:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta name="format-detection" content="telephone=no">
  <meta name="msapplication-tap-highlight" content="no">
  <meta name="viewport"
        content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">

  <base href="/">
  <meta charset="utf-8">
  <title>My App</title>
  <meta name="description" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="/css/all.css">
</head>
<body>

  <sd-app>Loading...</sd-app>

  <script>
  if (!Object.hasOwnProperty('name')) {
    Object.defineProperty(Function.prototype, 'name', {
      get: function() {
        var matches = this.toString().match(/^\s*function\s*((?![0-9])[a-zA-Z0-9_$]*)\s*\(/);
        var name = matches && matches.length > 1 ? matches[1] : "";

        Object.defineProperty(this, 'name', {value: name});
        return name;
      }
    });
  }
  </script>

  <script>
  // Fixes undefined module function in SystemJS bundle
  function module() {}
  </script>

  <script src="./js/shims.js"></script>
  <script src="./js/app.js"></script>

</body>
</html>

enter image description here

Upvotes: 1

Views: 1411

Answers (2)

David Limkys
David Limkys

Reputation: 5133

For anyone interested in the future, I solved this problem, as I'm using angular 2 in my app, I defined as you can see in my code snippet a base url for my app :

  <base href="/">

This becomes a problem in cordova and should be deleted for an android/ios app.

Upvotes: 4

Hitesh Sahu
Hitesh Sahu

Reputation: 45072

if css and js folder are in same level as index.html you should link them like this :-

<link href="css/android/prelogin.css" rel="stylesheet">
<script type="text/javascript" src="cordova.js"></script>
<script src="scripts/lib/jquery/jquery.1.9.1.js"></script>
<script src="scripts/lib/jquery/jquery.mobile-1.3.2.js"></script>

see screen shot for more clarity

enter image description here

Upvotes: 2

Related Questions