プロジェクトローカルの Cordova を使う

Cordova でアプリを作っていると、プロジェクトごとに Cordova のバージョンが切り替えられたらなあと思ったことはないでしょうか?

プロジェクトを始める前にそのプロジェクト用の Cordova を再インストールしてもいいのですが...

$ npm install -g cordova@4.0.0

こんな感じですね。でも、この方法だと間違いそうです。

generator-graybullet-cordova でプロジェクトを作成すると、この問題が解決します。

generator-graybullet-cordova は Cordova をプロジェクトローカルにインストールします。grunt タスクを使っている限りはプロジェクトローカルの Cordova が使われます。

例えば、cordova@4.0.0 を使うプロジェクトを作る場合は以下のようにします。

# プロジェクトの作成では cordova@4.0.0 が使われるようにする
npm install -g cordova@4.0.0
 
# プロジェクトを作る
mkdir app; cd $_
yo graybullet-cordova

package.json を見ると、cordova@4.0.0 が使われていることがわかります。

cat package.son | grep cordova
    "cordova": "4.0.0",
    "grunt-cordova-ng": "^0.1.3"

プラグインやプラットフォームのインストールは cordova コマンドの代わりに grunt の cordova タスクを使います。Cordova がグローバルインストールされている必要はもうありません。

# 試しに Cordova を削除する
npm uninstall -g cordova
 
# cordova plugin list
grunt cordova:plugin:list
 
# cordova plugin add org.apache.cordova.camera
grunt cordova:plugin:add:org.apache.cordova.camera
 
# cordova platform list
grunt cordova:plugin:list

この機能はgrunt-cordova-ng によって提供されています。他に何ができるかは grunt-cordova-ng の README を読んでください。基本的に、cordova コマンドの実行を ":" で区切ったものなので、それほど難しくはないはずです。

他にも cordova:build や cordova:emulate といったタスクがありますが、build や emulate を使った方がいいでしょう。前者は cordova コマンドを実行するだけですが、後者は HTML5 アプリのビルドを実行してから cordova コマンドを実行します。build や emulate タスクは generator-graybullet-cordova が提供しています。

grunt cordova:build
# cordova build が実行される
 
grunt build
# HTML5 アプリのビルドが実行される
# cordova build が実行される

なお、grunt-cordova-ng は単体でも使えます。新しく作った Cordova プロジェクトで使ってみます。

cordova create app
cd app
npm init
npm install --save-dev grunt cordova@4.0.0 grunt-cordova-ng

あとはこんな感じの Gruntfile.js を用意します。

module.exports = function (grunt) {
  grunt.loadNpmTasks('grunt-cordova-ng');
};

これで cordova:* タスクが使えるようになります。

コメントを追加

Filtered HTML

  • ウェブページアドレスとメールアドレスは、自動的にハイパーリンクに変換されます。
  • 使用できるHTMLタグ: <a> <em> <strong> <cite> <code> <ul> <ol> <li> <dl> <dt> <dd> <blockquote> <img>
  • 次のタグを使用してソースコード構文をハイライトすることができます。: <code>, <blockcode>, <c>, <cpp>, <drupal5>, <drupal6>, <java>, <javascript>, <php>, <python>, <ruby> The supported tag styles are: <foo>, [foo].
  • 行と段落は自動的に折り返されます。

Plain text

  • HTMLタグは利用できません。
  • ウェブページアドレスとメールアドレスは、自動的にハイパーリンクに変換されます。
  • 行と段落は自動的に折り返されます。
CAPTCHA
This question is for testing whether you are a human visitor and to prevent automated spam submissions.
イメージ CAPTCHA
Enter the characters shown in the image.