Windows10でのIonic3開発環境の構築

posted in: Ionic3 | 0

松山事務所の石丸です。
Windows10(64bit)上に、Ionic3を使ってAndroidアプリを開発する環境を構築します。
ハイブリッドアプリ開発では、当然iOSもターゲットになるので、Macでの開発がベストだと思いますが、Windows10でAndroidのみをターゲットにします。

インストールするもの

すべてデフォルト設定でインストールします。

Java SE Development Kit 8 Downloads(8u131)
http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html
Android Studio(2.3.3.0)
https://developer.android.com/studio/index.html
Node.js(6.11.0 LTS)
https://nodejs.org/ja/

環境変数を設定

環境変数JAVA_HOMEANDROID_HOMEを追加。
環境変数Pathにplatform-toolstoolsを追加します。

JAVA_HOME
C:\Program Files\Java\jdk1.8.0_131
ANDROID_HOME
C:\Users\{ユーザ名}\AppData\Local\Android\sdk
Path
%ANDROID_HOME%\platform-tools
%ANDROID_HOME%\tools

Ionicのインストールと動作確認

公式サイトにある通り、まずはcordovaとionicをインストールします。

バージョンを指定してインストールする場合は次のようにします。

インストールが完了したらionic startコマンドでひな形を作り、

ブラウザで表示してみます。

exec_browser

Androidで動作確認

Androidをビルド対象とするため、以下のコマンドでプラットフォームを追加します。

PCに接続した実機で実行してみます。

うまく実行されたでしょうか?

LINEで送る
Pocket