WindowsでPhoneGapを使ってAndroid向けにビルドした時のメモ
前書き
PhoneGapを初めて使ってみました。そのときにはまったこと等のメモを
はじめは PhoneGap Fan - PhoneGap (Cordova) の日本語コミュニティというサイトを見て始めたのですが、導入手順のページが旧式のままになってしまっているようで始め混乱しました。
環境
- Windows 7 pro 64bit
- Node.js v0.10.24
- npm 1.3.21
- Android SDK Manager 22.6.2
JDK 1.7.0_51
Galaxy Nexus (Androidバージョン 4.3)
先に結論
これだけやってしまいましょう。
Androidでビルドするまでの手順
大まかな流れはこちらの通りです
Android - PhoneGap(Cordova) のインストールと始め方 - Qiita
上から順にやっていきます。Windowsなのでコマンドラインです。
Node.jsのインストール
既にやっていました。
npm install -g phonegap
普通に出来ました。
自分でやったか覚えていないのですが、.npmrc でちゃんとレジストリが http://registry... としてあったのと、プロキシの設定も proxy = http://domain:port/ としてあったので、問題無くインストールできたようです。 レジストリが https://registry... になっていると、外に取りに行けずPhoneGapのインストールに失敗するようです。
phonegap create projectname
引っかかりました orz
エラー抜粋
[phonegap] downloading https://github.com/phonegap/phonegap-app-hello-world/archive/3.4.0.tar.gz...
[phonegap] the options C:\Users\useraccount\------\projectnamecom.phonegap.helloworld HelloWorld
{ [Error: tunneling socket could not be established, cause=getaddrinfo ENOTFOUND] code: 'ECONNRESET' }
[error] tunneling socket could not be established, cause=getaddrinfo ENOTFOUND
調べてみると、proxy関連のようです。すでに .npmrc にはproxy = http://domain:port が書き込んであるのですが、これだけではダメなようです。
また、エラーコードのアドレスを見てみると、とgithubへのhttpsでのDLが失敗している様なので、以下のサイトの様にnpm用のhttps-proxyを設定します。
node.js - Is there a way to make npm install (the command) to work behind proxy? - Stack Overflow
npm config set https-proxy http://domain:proxy とすると、.npmrcにhttps-proxyの項目が書き加えられます。
これで成功します。
次に進む前に、作った projectname ディレクトリに入っておきます
> cd projectname
ちなみに蛇足：失敗の再現法
このブログを書くに当たって上記エラーを再現しようとしたところ、なかなか再現せず、プロジェクト作成に成功してしまいました。。いろいろ調べて分かったのですが、c:\Users\useraccount\.cordova に、https://github.com/phonegap/phonegap-app-hello-world/archive/3.4.0.tar.gz の中身が展開されて残っており、そこを見つけてプロジェクトを作成していたからのようです。 npm rm phonegap した際にあわせてc:\Users\useraccount\.cordovaも行い、そこから再度 npm install -g phonegap すると、その後の phonegap create projectname が失敗します。
phonegap build android
また引っかかりました。orz
エラー抜粋
Error: ERROR : executing command 'ant', make sure you have ant installed and added to your path.
これは分かりやすいですね。PATHに ant のある場所を足しましょう。私の場合はEclipseを入れていたので、Eclipseディレクトリ内のantを指すことにします。
C:\myPrograms\eclipse\plugins\org.apache.ant_1.8.4.v201303080030\bin
このアドレスを、システム環境変数 Path に追加します。 (ちなみに環境変数を書き換えた後はコマンドプロンプトは再起動します)
あらためて phonegap build android
またまた引っかかりました orz
エラー抜粋
Error: An error occurred while listing Android targets
at C:\Users\useraccount\.cordova\lib\android\cordova\3.4.0\bin\lib\check_reqs.js:87:29
これはググったら直ぐに分かりました
初期インストール時に「An error occurred while listing Android targets」が出てしまう場合の対処 - 開発の風景 〜KKZのSE日記〜
PATHに、android.bat の在処を足しましょう。adbコマンドのために Android\sdk\platform-tools はPATHに入れていることが多いと思うのですが、ここでは、toolsフォルダになります。私の場合はこちら
C:\myPrograms\Android\sdk\tools
このアドレスも、システム環境変数 Path に追加します。 (ちなみに環境変数を書き換えた後はコマンドプロンプトは再起動します)
さらに改めて phonegap build android
またまたまた引っかかりました
エラー抜粋
C:\myPrograms\Android\sdk\tools\ant\build.xml:734: Unable to find a javac compiler; com.sun.tools.javac.Main is not on the classpath. Perhaps JAVA_HOME does not point to the JDK. It is currently set to "C:\Program Files\Java\jre7"
これも分かりやすいですね。javacが見つかりません。 おかしいなぁ(笑) どうやらこのパソコンでは設定したことが無かったようです。また、エラー文中に JAVA_HOME というパス名が出てきているので、これを使いましょう。
システム環境変数に新規で追加。(私の場合)
- 変数名
JAVA_HOME - 変数値
C:\Program Files\Java\jdk1.7.0_51
結局システム環境変数に3つ値を足しましたが、ようやくこれで出来たようです。正しく出来た場合はこんな出力です。
BUILD SUCCESSFUL Total time: 14 seconds [phonegap] successfully compiled Android app
また、projectname\platforms\android\ant-build\HelloWorld-debug.apk が出力されていることも確認出来ます。
phonegap run android
またビルドもしちゃっている様な気もしますが、気にせずやってしまいます。
BUILD SUCCESSFUL Total time: 6 seconds WARNING : No target specified, deploying to device '0146975A0800A003'. Using apk: C:\Users\useraccount\-----\projectname\platforms\android\ant-build\HelloWorld-debug-unaligned.apk Installing app on device... Launching application... LAUNCH SUCCESS [phonegap] successfully installed onto device
できました。
あらためて結論
これだけやってしまいましょう。
以上です。
