Cordovaの開発環境を整える話
タイトル通り。
ちょっと自分の時間が取れたので、久しぶりにやったことのメモ。 以前から興味のあったCordovaでアプリ作ろうかなと思って、その開発環境を整えました。
Cordovaとは
今更ハイブリットアプリとはなんぞや、とか、そういう話をしたところで・・と思うので割愛。 簡単に言えば、HTML&Javascript&CSSでネイティブアプリが作れるよってことです。 もとはPhoneGapというツールだったのがApacheがホニャララしてできたツールです。 こういう話は公式読んだ方がわかりやすいのでそちらを参照。 Cordova概要
もともとJAVA書いてた人とか、Objective-C(Swift)書いてる人はその言語で書いた方がわかりやすいと思いますが・・ 残念ながら、JAVAもSwiftも端っこを少しかじった程度なので、WEBの技術でネイティブアプリが書けるのは正直ありがたい。 ちなみに、Androidは今だったらKotlinが来てるのかな? 今年のGoogleI/OでKotlinが正式サポートって話もあったしね。 参考:Google I/O 2017 : Introduction to Kotlin (和訳/要約)
と、話がそれたけど本題に行こう。
サンプルプロジェクトの作成
環境はいつものようにMacOS。
ちなみにNode.jsはインストール済みとします。
iOSでエミュレートする場合はXcodeが必要になります。
(Androidは知らん)
まずはCordebva本体のインストール
npm install -g cordova
プロジェクトを作成
cordova create /dev/MyApp
これで、Cordovaのサンプルプロジェクトが作成されました。 作った場所に移動すると、サンプルプロジェクトのファイルができています。
んで、そこに移動
cd /dev/MyApp/
プラットフォームを追加する 実際に動作させる環境をここで設定します。 今回はブラウザとiOSで確認したので、以下のようなコマンドになります。
cordova platform add browser ios
Androidで確認する場合は、androidを追加します。
実行してみる
今回はブラウザとiosのエミュレーションで確認していきます。
まずはブラウザで確認するので、
cordova run browser
すると、chromeが立ち上がってこんな画面が表示されます。
次にiOSで確認するので、Xcodeを起動してエミュレーターを実行して、
cordeva run ios
とすると
Error: ios-deploy was not found. Please download, build and install version 1.9.0 or greater from https://github.com/phonegap/ios-deploy into your path, or do 'npm install -g ios-deploy'
なんかエラーでた・・・ ios-deployがねーよってことなので、
npm install -g ios-deploy
xcode-select --install
で、ライセンスに同意する
sudo xcodebuild -license
長いけど下まで読んで[agree]するとOK
さて、もっかい実行! とすると
Error: Error code 65 for command: xcodebuild with args: -xcconfig....(以下略)
[Cordova error 65]で検索すると、どうもiOSのエミュレート(実機デバッグ)する場合はProvisioning Profileなるものが必要らしい。。 なんぞそれ?と思ってると、どうも platforms/ios/にある[.xcodeproj]を編集すればいいとのこと。
というわけで、Xcodeから.xcodeprojを開く
この中央にある[singing]-[term]に自分のAppleIDを紐づけてやるとOK
僕は個人開発ですし、まだ公開する予定もないのでディベロッパーライセンスも持ってないのでこれでいいっぽい。
実際にアプリ作って公開する場合はライセンスがいるから、それはまた別の話かな。
2017/06/19追記
やっぱライセンスは必要みたいですね。
さて、諸々解決したはずなので・・・
改めて実行すると
無事に確認できました。
ちなみに、実機で確認する場合はUSB接続をして
cordova run ios --device
という感じで --device オプションを指定してやるといけます。
今日はこんな感じで。