I am learning Phone-gap for the first time. This is a simple app. But whenever I am trying to build it is showing me
unable to create app, invalid file type.
I am showing code of index.html file and config file bellow.
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<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" />
<!-- This is a wide open CSP declaration. To lock this down for production, see below. -->
<meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src *" />
<!-- Good default declaration:
* gap: is required only on iOS (when using UIWebView) and is needed for JS->native communication
* https://ssl.gstatic.com is required only on Android and is needed for TalkBack to function properly
* Disables use of eval() and inline scripts in order to mitigate risk of XSS vulnerabilities. To change this:
* Enable inline JS: add 'unsafe-inline' to default-src
* Enable eval(): add 'unsafe-eval' to default-src
* Create your own at http://cspisawesome.com
-->
<!-- <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: 'unsafe-inline' https://ssl.gstatic.com; style-src 'self' 'unsafe-inline'; media-src *" /> -->
<link rel="stylesheet" type="text/css" href="css/index.css" />
<title>hybrid app</title>
</head>
<body>
<div class="container">
<div id="sidebar">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Blog</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">About</a></li>
</ul>
</div>
<div class="main-content">
<div class="swipe-area"></div>
<a href="#" data-toggle=".container" id="sidebar-toggle"> <span class="bar"></span> <span class="bar"></span> <span class="bar"></span> </a>
<div class="content">
<h1>Hybrid App</h1>
<div class="jquery-script-ads"><script type="text/javascript"><!--
google_ad_client = "ca-pub-2783044520727903";
/* jQuery_demo */
google_ad_slot = "2780937993";
google_ad_width = 728;
google_ad_height = 90;
//-->
</script>
</div> </div>
<div class="para">
<p>Hybrid Mobile Applications. Hybrid development combines the best (or worst) of both the native and HTML5 worlds. We define hybrid as a web app, primarily built using HTML5 and JavaScript, that is then wrapped inside a thin native container that provides access to native platform features.</p>
</div>
<div>
<a href=""><img src="www\com.phonegap.hello-world\master\template_src\www\native_html_hybrid_apps_development_1920_700_1.jpg" width="1300" height="700" alt=""></a>
</div>
</div>
</div>
<script type="text/javascript" src="cordova.js"></script>
<script type="text/javascript" src="js/index.js"></script>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.touchswipe/1.6.4/jquery.touchSwipe.min.js"></script>
<script>
$(window).load(function(){
$("[data-toggle]").click(function() {
var toggle_el = $(this).data("toggle");
$(toggle_el).toggleClass("open-sidebar");
});
$(".swipe-area").swipe({
swipeStatus:function(event, phase, direction, distance, duration, fingers)
{
if (phase=="move" && direction =="right") {
$(".container").addClass("open-sidebar");
return false;
}
if (phase=="move" && direction =="left") {
$(".container").removeClass("open-sidebar");
return false;
}
}
});
});
</script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-36251023-1']);
_gaq.push(['_setDomainName', 'jqueryscript.net']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>
config.xml
<?xml version="1.0" encoding="UTF-8"?>
<!-- config.xml reference: https://build.phonegap.com/docs/config-xml -->
<widget xmlns = "http://www.w3.org/ns/widgets"
xmlns:gap = "http://phonegap.com/ns/1.0"
id = "com.phonegap.hybridapp"
version = "1.0.0">
<name>Hybrid App</name>
<description>
Hello World sample application that responds to the deviceready event.
</description>
<author href="http://phonegap.com" email="[email protected]">
Nidhin johny
</author>
<!-- Define the main entry-point to the application -->
<www/res/icon/ios/ src="index.html" />
<!-- Customize your app and platform with the preference element. -->
<preference name="DisallowOverscroll" value="true" />
<!-- android: MIN SDK version supported on the target device. MAX version is blank by default. -->
<preference name="android-minSdkVersion" value="14" />
<!-- Define a specific version of PhoneGap to build into your app. -->
<!-- <preference name="phonegap-version" value="cli-6.0.0" /> -->
<!-- Plugins -->
<!-- Core plugins -->
<plugin name="cordova-plugin-battery-status" source="npm" spec="~1.1.1" />
<plugin name="cordova-plugin-camera" source="npm" spec="~2.1.1" />
<plugin name="cordova-plugin-media-capture" source="npm" spec="~1.2.0" />
<plugin name="cordova-plugin-console" source="npm" spec="~1.0.2" />
<plugin name="cordova-plugin-contacts" source="npm" spec="~2.0.1" />
<plugin name="cordova-plugin-device" source="npm" spec="~1.1.1" />
<plugin name="cordova-plugin-device-motion" source="npm" spec="~1.2.0" />
<plugin name="cordova-plugin-device-orientation" source="npm" spec="~1.0.2" />
<plugin name="cordova-plugin-dialogs" source="npm" spec="~1.2.0" />
<plugin name="cordova-plugin-file" source="npm" spec="~4.1.1" />
<plugin name="cordova-plugin-file-transfer" source="npm" spec="~1.5.0" />
<plugin name="cordova-plugin-geolocation" source="npm" spec="~2.1.0" />
<plugin name="cordova-plugin-globalization" source="npm" spec="~1.0.3" />
<plugin name="cordova-plugin-inappbrowser" source="npm" spec="~1.3.0" />
<plugin name="cordova-plugin-media" source="npm" spec="~2.2.0" />
<plugin name="cordova-plugin-network-information" source="npm" spec="~1.2.0" />
<plugin name="cordova-plugin-splashscreen" source="npm" spec="~3.2.1" />
<plugin name="cordova-plugin-statusbar" source="npm" spec="~2.1.2" />
<plugin name="cordova-plugin-vibration" source="npm" spec="~2.1.0" />
<plugin name="cordova-plugin-whitelist" source="npm" spec="~1.2.1" />
<!-- Define app icon and splashscreen for each platform. -->
<icon src="icon.png" />
<platform name="android">
<icon src = "www/res/icon/android/icon-36-ldpi.png"
gap:platform = "android" gap:qualifier = "ldpi" />
<icon src = "www/res/icon/android/icon-48-mdpi.png"
gap:platform = "android" gap:qualifier = "mdpi" />
<icon src = "www/res/icon/android/icon-72-hdpi.png"
gap:platform = "android" gap:qualifier = "hdpi" />
<icon src = "www/res/icon/android/icon-96-xhdpi.png"
gap:platform = "android" gap:qualifier = "xhdpi" />
<icon src = "www/res/icon/android/icon-144-xxhdpi.png"
gap:platform = "android" gap:qualifier = "xxhdpi" />
<icon src = "www/res/icon/android/icon-192-xxxhdpi.png"
gap:platform = "android" gap:qualifier = "xxxhdpi" />
<splash src="www/res/screens/android/screen-hdpi-portrait.png" density="hdpi" />
<splash src="www/res/screens/android/screen-ldpi-portrait.png" density="ldpi"/>
<splash src="www/res/screens/android/screen-mdpi-portrait.png" density="mdpi" />
<splash src="www/res/screens/android/screen-xhdpi-portrait.png" density="xhdpi" />
</platform>
<platform name="ios">
<icon src = "www/res/icon/ios/icon.png" gap:platform = "ios" gap:qualifier = ""/>
<icon src = "www/res/icon/ios/icon.png" gap:platform = "ios" width = "57" height = "57" />
<icon src = "www/res/icon/ios/icon-72.png" gap:platform = "ios" width = "72" height = "72" />
<icon src = "www/res/icon/ios/icon-2x.png" gap:platform = "ios" width = "114" height = "114" />
<icon src = "www/res/icon/ios/icon-72-2x.png" gap:platform = "ios" width = "144" height = "144" />
<splash src="www/res/screen/ios/screen-ipad-portrait.png" platform="ios" width="768" height="1024" />
<splash src="www/res/screen/ios/screen-ipad-portrait-2x.png" platform="ios" width="1536" height="2048" />
<splash src="www/res/screen/ios/screen-iphone-portrait.png" platform="ios" width="320" height="480" />
<splash src="www/res/screen/ios/screen-iphone-portrait-2x.png" platform="ios" width="640" height="960" />
<splash src="www/res/screen/ios/screen-iphone-portrait-568h-2x.png" platform="ios" width="640" height="1136" />
<splash src="www/res/screen/ios/screen-iphone-portrait-667h.png" platform="ios" width="750" height="1334" />
<splash src="www/res/screen/ios/screen-iphone-portrait-736h.png" platform="ios" width="1242" height="2208" />
</platform>
<!--
Define access to external domains.
<access /> - a blank access tag denies access to all external resources.
<access origin="*" /> - a wildcard access tag allows access to all external resource.
Otherwise, you can specify specific domains:
-->
<access origin="*" />
<!--
<access origin="http://phonegap.com" /> - allow any secure requests to http://phonegap.com/
<access origin="http://phonegap.com" subdomains="true" /> - same as above, but including subdomains, such as http://build.phonegap.com/
<access origin="http://phonegap.com" browserOnly="true" /> - only allows http://phonegap.com to be opened by the child browser.
-->
<!-- Added the following intents to support the removal of whitelist code from base cordova to a plugin -->
<!-- Whitelist configuration. Refer to https://cordova.apache.org/docs/en/edge/guide_appdev_whitelist_index.md.html -->
<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>
</widget>
Folder of phone gap
I ALSO USE PHONEGAP CLI BUT IT IS NOT WORKING PROPERLY .also attaching screenshot below.
unable to create app, invalid file type
The error indicates that the file type that you are trying to upload is not valid.
Phonegap Build requires a .zip
file to be uploaded. Having a .rar
file will not be accepted, please create a zip file of your project and then upload it.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With