How to Setup Cordova for Windows 7

Setup Cordova

Text Editor / IDE

You may need to prepare an IDE or Editor for working. Here for example, install a Sublime Text 3 over Windows, actually it contains versions of Mac OS as well as Linux.

Sublime Text 3

You may follow the following sites to install Sublime Test 3 and its plugins.

• Sublime Text 3
• Package Control

After install Package control. Then use ctrl+shift+p to open quick commands. Input Install Package and Enter you will find your favorate plugins and install with them.

The Package Manager can be install in console. The console is accessed via the ctrl+\shortcut or theView > Show Console` menu. Then put the below codes in and enter. Wait one minute... done!

import urllib.request,os,hashlib; h = '7183a2d3e96f11eeadd761d777e62404' + 'e330c659d4bb41d3bdf022e94cab3cd0'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by) 

CoffeeCompile

To configure to connect with coffee script, open in the menu Preference > Package Setting > CoffeeCompile > Settings - User and edit with:

{
    "coffee_path": "C:\\Users\\{{your-windows-user}}\\AppData\\Roaming\\npm\\coffee"
}

The Command-Line Interface

Instlaling the Requrements first

JDK

To download and install JDK. And configure environment as below. I Install JDK in C:\usr\opt\Java\jdk1.7.0_45 folder.

set JAVA_HOME=C:\usr\opt\Java\jdk1.7.0_45
set Path=%Path%;%JAVA_HOME%\bin
set classpath=.;%JAVA_HOME%\lib

Android SDK / ADT Bundle

To download and install Android SDK / ADT Bundle. And configure environments as below. I Instlal ADT Bundle in C:\usr\opt\adt-bundle, and an Eclipse IDE is prepared for you together with sdk.

set ADT_HOME=C:\usr\opt\adt-bundle
set Path=%Path%;%ADT_HOME%\sdk\platform-tools;%ADT_HOME%\sdk\tools

Ant

To download and install Ant. And configure environment as below. I install Ant in C:\usr\opt\ant folder.

set ANT_HOME=C:\usr\opt\ant
set Path=%Path%;%ANT_HOME%\bin

Installing the Cordova CLI

To install the cordova command-line tool, follow these steps:

Download and install Node.js. Following installation, you should be able to invoke node and npm on your command line. If desired, you may optionally use a tool such as nvm or nave to manage your Node.js installation.

Download and install a git client, if you don't already have one. Following installation, you should be able to invoke git on your command line. Even though you won't be using git manually, the CLI does use it behind-the-scenes to download some assets when creating a new project.

Install the cordova module using npm utility of Node.js. The cordova module will automatically be downloaded by the npm utility.

on Windows:

C:\>npm install -g cordova

Create the App

$ cordova create hello com.example.hello HelloWorld

Add Platforms

Run any of these from a Windows machine, where wp refers to different versions of the Windows Phone operating system:

$ cordova platform add wp7
$ cordova platform add wp8
$ cordova platform add windows8
$ cordova platform add amazon-fireos
$ cordova platform add android
$ cordova platform add blackberry10
$ cordova platform add firefoxos

Run this to check your current set of platforms:

$ cordova platforms ls

Run either of the following synonymous commands to remove a platform:

$ cordova platform remove blackberry10
$ cordova platform rm amazon-fireos
$ cordova platform rm android

WARNING: When using the CLI to build your application, you should not edit any files in the /platforms/ directory unless you know what you are doing, or if documentation specifies otherwise. The files in this directory are routinely overwritten when preparing applications for building, or when plugins are reinstalled.

If you wish at this point, you can use an SDK such as Eclipse or Xcode to open the project you created. You will need to open the derivative set of assets from the /platforms/ directory to develop with an SDK. This is because the SDK specific metadata files are stored within the appropriate /platform/ subdirectory. (See the Platform Guides for information on how to develop applications within each IDE.) Use this approach if you simply want to initialize a project using the CLI and then switch to an SDK for native work.

Read on if you wish to use the cross-platform workflow approach (the CLI) for the entire development cycle.

Build the App

By default, the cordova create script generates a skeletal web-based application whose home page is the project's www/index.html file. Edit this application however you want, but any initialization should be specified as part of the deviceready event handler, referenced by default from www/js/index.js.

Run the following command to iteratively build the project:

$ cordova build

This generates platform-specific code within the project's platforms subdirectory. You can optionally limit the scope of each build to specific platforms:

$ cordova build android

Test the App on an Emulator or Device

Run a command such as the following to rebuild the app and view it within a specific platform's emulator:

$ cordova emulate android

Alternately, you can plug the handset into your computer and test the app directly:

$ cordova run android

Add Plugin Features

The cordova plugin add command requires you to specify the repository for the plugin code. Here are examples of how you might use the CLI to add features to the app:

Basic device information (Device API):

$ cordova plugin add org.apache.cordova.device

Network Connection and Battery Events:

$ cordova plugin add org.apache.cordova.network-information
$ cordova plugin add org.apache.cordova.battery-status

Accelerometer, Compass, and Geolocation:

$ cordova plugin add org.apache.cordova.device-motion
$ cordova plugin add org.apache.cordova.device-orientation
$ cordova plugin add org.apache.cordova.geolocation

Camera, Media playback and Capture:

$ cordova plugin add org.apache.cordova.camera
$ cordova plugin add org.apache.cordova.media-capture
$ cordova plugin add org.apache.cordova.media

Access files on device or network (File API):

$ cordova plugin add org.apache.cordova.file
$ cordova plugin add org.apache.cordova.file-transfer

Notification via dialog box or vibration:

$ cordova plugin add org.apache.cordova.dialogs
$ cordova plugin add org.apache.cordova.vibration

Contacts:

$ cordova plugin add org.apache.cordova.contacts

Globalization:

$ cordova plugin add org.apache.cordova.globalization

Splashscreen:

$ cordova plugin add org.apache.cordova.splashscreen

Open new browser windows (InAppBrowser):

$ cordova plugin add org.apache.cordova.inappbrowser

Debug console:

$ cordova plugin add org.apache.cordova.console

Updating Cordova and Your Project

After installing the cordova utility, you can always update it to the latest version by running the following command:

$ sudo npm update -g cordova

Run a command such as the following for each platform you're building:

$ cordova platform update android
$ cordova platform update ios
...etc.

SEE ALSO

Apache Cordova Document