seseragiseven

Ionic 2 CLI v3 クイックリファレンス

Ionic CLIは、コマンドラインから簡単にWebでの表示やプラットフォームの追加、ページの作成などを行えるツール。
バージョンが3になって書き方がちょっと変わった。なので、前回のことはじめ記事でも触れたけど再度まとめてみようと思う。

CLIのインストール

まだCLIをインストールしていない場合は、npmを付けてインストールする。

npm install -g ionic@latest

インストールの確認

正常にインストールされたら、以下のコマンドで情報を見ることができる。

ionic info

新しいプロジェクトの開始

Ionicの様々なテンプレートを使ったりしてプロジェクトを開始できる。

ionic start [ProjectName] [template]
cd [ProjectName]

使用できるテンプレートはまっさらな「blank」、タブ表示が最初から付いた「tabs」、サイドメニューが付いた「sidemenu」、いろいろ付いた「super」がある。また「tutorial」でチュートリアル用プロジェクトを作成したりできる。前と違って「–v2」は付けなくて良くなった(デフォルトがIonic2)。

プラットフォームの追加

プロジェクトのターゲットとなるプラットフォームを追加する。「ios」「android」「browser」「blackberry」「webos」「windows」などがある。

ionic cordova platform add ios
ionic cordova platform add android
ionic cordova platform add browser

Webビューでの表示(Serve)

ローカルでのアプリをブラウザに表示する。

ionic serve

別のポートに表示(デフォルトは8100)。

ionic serve --port 7777

複数のプラットフォームでの表示を並べて実行。便利。

ionic serve --lab

ページやプロバイダを作成

ページやいろいろな動きに使うプロバイダなどの基礎を作成。

ionic g page [newPage]
ionic g provider [newProvider]

プロジェクトをビルド

ターゲットにしたプラットフォーム用にアプリをビルドする。

ionic cordova build

特定のプラットフォームのみのビルドを行うこともできる。

ionic cordova build ios

製品版のためのビルド。

ionic cordova build --prod --release

リソースの生成

アイコンやスプラッシュスクリーン画像などのリソースを自動で生成する。「resources」フォルダ内の「icon.png」と「splash.png」を更新した後、

ionic cordova resources

エミュレート

エミュレータでアプリケーションを起動する。

ionic cordova emulate ios

ライブリロード機能付きでエミュレート。

ionic cordova emulate ios --livereload

デバッグモードでエミュレート。

ionic cordova emulate ios --debug

接続されたデバイスで実行

ionic cordova run ios --device

補足:ネイティブプラグインの導入

まあドキュメンテーションの内容に従うだけなんだけども。

ionic cordova plugin add cordova-plugin-3dtouch

おまけ

--prodとか--debug--livereloadなんかのプションは基本的に使いそうなコマンドすべてに用意されてる。詳しくはIonic CLIドキュメント参照。

サイト移転しました!→「Hatoblog(はとブログ)

この記事をシェアする

コメントを残す

カテゴリー

人気の記事