Original address: Http://rensanning.iteye.com/blog/2016364CordovaPhoneGap Mobile app is divided into three main categories: Native App,hybrid app,web app. The hybrid app is between the native app and the Web App, which takes into account the native app's good user experience and powerful features, as well as the advantages of rapid web app development across platforms. The disadvantage is that relying on the performance of the Webview,webview of each platform directly determines the performance of the hybrid app.
At present, there are many hybrid app development frameworks at home and abroad, more representative of Foreign Cordova (aka PhoneGap), Sencha Touch, Titanium, Intel XDK, Rhomobile, Xamarin and other domestic appcan, Rexsee, XFace, and Dr. Dobb's journal won the Titanium Productivity Award in the 2014 Mobile Development Tool category Jolt Awards in PhoneGap and Jolt. Titanium should be part of the web-to-native converter, as well as native JavaScript apps, such as Chrome Apps/firefox os/windows 8 apps.
Based on open source Cordova, major companies have launched their own products, such as Adobe PhoneGap, Oracle ADF Mobile, SAP Kapsel, IBM Worklight, Microsoft's visual Studio also supports Cordova.
Installation Run
(1) Prerequisite environment
Install ANT, add the%ant_home%\bin to the PATH environment variable, or it will report the error "executing command ' ANT '" error.
Reference ant-h
Ant-version
Install the ANDROID SDK, add the%android_home%\tools;%android_home%\platform-tools to the PATH environment variable, or it will be reported as "Error:an Error occurred while Listing Android targets "wrong, and create good one avd in advance.
About the API version:
- 3.0 Required is ANDROID-17 (Android 4.2.2)
- 3.1 and 3.2 require android-18 (Android 4.3)
- 3.3 and 3.4 require android-19 (Android 4.4.2)
Reference android-h
ADB version
Android List AVD
Install node. js
Reference Node-v
Npm-v
If you need to install a plugin from a git address, you need to install Git.
Reference git--version
(2) Installing the Cordova CLI
References > NPM install-g Cordova
Installation path:
C:\Documents and Settings\rensanning\application Data\npm\node_modules\cordova
Update Cordova version
Reference NPM Update Cordova-g
If the installation is slow, you can set up a proxy:
Reference NPM config set proxy http://xx.xx.xx.xx:xxxx
NPM Config set Https-proxy http://xx.xx.xx.xx:xxxx
NPM Config list
Or use the domestic mirror station: http://cnpmjs.org
Reference NPM config Set Registry http://registry.cnpmjs.org
NPM Info Cordova
NPM--registry http://registry.cnpmjs.org Info Cordova
Current version: 3.7.0 (released 2014/10/01)
(3) Create and run project
A. Create a new directory Pro and enter
References > CD C:\pro
B. Creating a "MyApp" project
References > Cordova create MyApp com.yourname.myapp MyApp
C. Access to the engineering catalogue
Citation > CD MyApp
D. Add platform Support
References > Cordova Platforms add iOS
> Cordova Platforms Add Android
> Cordova Platforms LS
The CLI uses the SDK of each platform to create the project.
Update the version of the Cordova project
Cordova Platform Check
If there is a hint like "Android @ 3.3.0 could be updated to:3.4.0" You can perform the update
You can also view platforms\android\assets\www\cordova.js to confirm the current version information
Cordova Platform update Android
If you are prompted "all platforms is up-to-date." The description does not require an update.
E. Adding plugins
References > Cordova plugin add org.apache.cordova.device
> Cordova Plugin Add org.apache.cordova.console
> Cordova Plugin ls
Plugins can be installed from many places:
Plugin name (download from plugin repository): Cordova plugin Add Org.apache.cordova.console
git address: Cordova plugin Add Https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git
Local address: Cordova plugin Add D:\cordova-3.3.0\cordova-plugin-camera
Local file: Cordova plugin Add plugin.tar.gz
Specify version
Cordova plugin Add [email protected]
Cordova Plugin Add https://github.com/apache/cordova-plugin-console.git#r0.2.0
Cordova Plugin Add Https://github.com/someone/aplugin.git#:/my/sub/dir
Cordova Plugin Add Https://github.com/someone/aplugin.git#r0.0.1:/my/sub/dir
Wait a minute
F. Compiling code
References > Cordova build Android
G. Running code
Run on the emulator (provided that the AVD is created)
References > Cordova emulate Android
Windows convert command conflict, direct "Cordova emulate Android" will be reported error:spawn ENOENT, need to start the simulator first.
H. Running in the browser
References > Cordova serve Android
Browser access address: Http://localhost:8000/, you can debug the page like debugging the layout of the app. If the Cordova native API call is used in the app, the following dialog box pops up:
This is because the browser cannot provide @javascriptinterface interfaces, Cordova views interact through prompt () and native, and this is done because of Android2.3 simulator bugs. So debug the page layout, ignore it.
I. Install directly to the real machine via USB
References > Cordova run Android
The Cordova CLI uses the Lazy loading approach when you create Cordova projects, add platform support, install plugins, and so on, and download the appropriate files from the server to the appropriate folder. lazy-loaded files are stored in the System user's folder, such as Windows XP is C:\Documents and
Settings\rensanning\.cordova. So the first time use will be slower.
Common Commands
(1) Create <directory> [<id> [<name>]
Create a Cordova project with the ID of the package name.
(2) platform [LS | list]
List which platforms the project supports
(3) Platform add <platform> [<platform> ...]
Add one or more platform support for your project
(4) Platform [RM | remove] <platform> [<platform> ...]
Remove a platform support for this project
(5) Platform [up | update] <platform>
Update the Cordova version of a platform for this project
(6) plugin [ls | list]
List which plugins are included in the project
(7) plugin add <path-to-plugin> [<path-to-plugin> ...]
Add one or more plugins to your project
(8) Plugin [RM | remove] <plugin-name> [<plugin-name> ...]
Remove a plug-in from the project
(9) Plugin search [<keyword1> <keyword2> ...]
Search for plugins from registry based on keywords
(ten) Compile [platform ...]
Compiling app packages for the specified platform
(one) build [<platform> [<platform> [...]]
Do prepare first (copy file) and do compile
(emulate) [<platform> [<platform> [...]]
Launch simulator run app
(+) serve [port]
Start the local Web service to access WWW, the default port is 8000
referencing platform and platforms equivalents
Plugin and plugins equivalents
Detailed content can be viewed through the Cordova help command.
directory Structure
(1) Catalogue at a Glance:
Reference myapp/
|--Config
|--hooks/
| | | |--before_xxx/
| | '--after_xxx/
|--merges/
| | | |--Android/
| | '--ios/
|--platforms/
| |--Android/
| '--ios/
|--plugins/
| |--org.apache.cordova.console/
| '--org.apache.cordova.device/
|--www/
| |--css/
| |--img/
' |--js/
'--index.html
(2) Config
Configuration file for Cordova
(3) Hooks catalogue
The script file that holds the custom Cordova command. Each project command can define before and after hooks, such as: Before_build, After_build.
Hooks can be written in any programming language, and the Cordova CLI uses node. js, so it's generally written with it.
There are 3 common hook scripts available:
http://devgirl.org/2013/11/12/three-hooks-your-cordovaphonegap-project-needs/
(4) Merges catalogue
The storage platform special files, will be merged with WWW compile, the same file merges file priority.
Like what:
Reference merges/
|--ios/
| '--app.js
|--Android/
| '--android.js
www/
'--app.js
Compiled into iOS apps, including Merges/ios/app.js, while Android apps include Www/app.js, Merges/android/android.js
(5) Platforms catalogue
Native code engineering for each platform, do not modify it manually because it will be overwritten at build time.
(6) Plugins catalogue
The plug-in directory (the native API provided by Cordova is also provided as a plug-in).
(7) WWW directory
The source code directory will be copied to the Assets\www directory of each platform project when Cordova prepare.
Where Index.html is the application's entry file.
MORE: http://cordova.apache.org/docs/en/3.4.0/index.html
Cordova 3.x Foundation (1)--Environment Construction (windows/android) (EXT)
