【PhoneGap】環境安裝配置淺析

【PhoneGap】環境安裝配置淺析

分類： 其它 2013-11-05 10:03 1283人閱讀 評論(0) 收藏 舉報

phonegap ios平臺

因爲項目須要，須要瞭解PhoneGap架構以其在各個平臺的環境配置，閱讀了官網部分文檔，總結以下。

【官網地址】

http://phonegap.com/

【環境配置】

參考： http://phonegap.com/install/

1. 安裝NodeJs。 打開NodeJs的官網：http://nodejs.org/   點擊「install」，便可完成安裝。

 NodeJS安裝完成後，會自帶把npm安裝好，npm也在第二步中須要用到。

2. 安裝phoneGap

在控制檯運行命令：

sudo npm install -g phonegap

輸出結果以下：

/usr/local/bin/phonegap -> /usr/local/lib/node_modules/phonegap/bin/phonegap.js
phonegap@3.1.0-0.15.0 /usr/local/lib/node_modules/phonegap
├── colors@0.6.0-1
├── pluralize@0.0.4
├── semver@1.1.0
├── qrcode-terminal@0.9.4
├── shelljs@0.1.4
├── optimist@0.6.0 (wordwrap@0.0.2, minimist@0.0.5)
├── node-static@0.7.0 (colors@0.6.2, mime@1.2.11)
├── phonegap-build@0.8.4 (qrcode-terminal@0.8.0, optimist@0.3.7, shelljs@0.0.9, phonegap-build-api@0.3.3)
├── prompt@0.2.11 (revalidator@0.1.5, pkginfo@0.3.0, read@1.0.5, winston@0.6.2, utile@0.2.0)
└── cordova@3.1.0-0.1.0 (ncallbacks@1.0.0, colors@0.6.2, open@0.0.3, mime@1.2.11, shelljs@0.1.2, follow-redirects@0.0.3, tar@0.1.18, prompt@0.2.7, glob@3.2.6, elementtree@0.1.5, xcode@0.5.1, npm@1.3.13, express@3.0.0, request@2.22.0, plist@0.4.3, ripple-emulator@0.9.18, plugman@0.13.0)

3. 使用phoneGap

輸入命令：

$ phonegap create my-app
$ cd my-app
$ phonegap run android

其中，能夠關聯create命令： （在bashrc中關聯bin裏面的create命令）

# PhoneGap
alias pgap='/Library/PhoneGap/bin/create'

‘=’右邊爲具體的phoneGap路徑。
建立工程的格式爲：

pgap <project_folder_path> <package_name> <project_name>

【PhoneGap在IOS平臺的應用】

官網連接爲：  http://docs.phonegap.com/en/edge/guide_platforms_ios_index.md.html#iOS%20Platform%20Guide

$ cordova create hello com.example.hello "HelloWorld"
$ cd hello
$ cordova platform add ios
$ cordova prepare              # or "cordova build"

[error1] cordova: command not found

[solution1]

須要安裝：

sudo npm install -g cordova

cordova 和phonegap雖然是來自同一家，但仍是不一樣的，他們的關係就像webkit和google chrome。。要運行這個cordova固然得安裝。

[solution2]

執行命令及結果：

Scotts-iMac:helloworld mac$ phonegap create hello com.example.hello "HelloWorld"
[phonegap] missing library phonegap/www/3.1.0
[phonegap] downloading https://github.com/phonegap/phonegap-app-hello-world/archive/3.1.0.tar.gz...
[phonegap] created project at /Users/mac/Documents/PhoneGap/helloworld/hello

[error2] 運行命令：phonegap run ios 失敗

[solution2]

phonegap run ios
[phonegap] detecting iOS SDK environment...
[phonegap] using the local environment
[phonegap] adding the iOS platform...
[phonegap] missing library cordova/ios/3.1.0
[phonegap] downloading https://git-wip-us.apache.org/repos/asf?p=cordova-ios.git;a=snapshot;h=3.1.0;sf=tgz...
[phonegap] compiling iOS...
[phonegap] successfully compiled iOS app
[phonegap] trying to install app onto device
[phonegap] no device was found
[phonegap] trying to install app onto emulator
 [warning] missing ios-sim
 [warning] install ios-sim from http://github.com/phonegap/ios-sim
   [error] An error occurred while emulating/deploying the ios project.=== CLEAN TARGET CordovaLib OF PROJECT CordovaLib WITH CONFIGURATION Debug ===

但這個命令會再對應路徑下生成響應的IOS 工程文件，打開「HelloWorld.xcodeproj」， 能夠正常編譯，運行。

錯誤的緣由是簽名致使，沒有正確的profile文件。

【PhoneGap系統架構】

網上找的架構圖以下：

【IOS中使用方法】

#import <Cordova/CDVViewController.h>
CDVViewController* viewController = [CDVViewController new];
viewController.wwwFolderName = @"myfolder";
viewController.startPage = @"mystartpage.html";
viewController.useSplashScreen = YES;
viewController.view.frame = CGRectMake(0, 0, 320, 480);
[myView addSubview:viewController.view];