Help us understand the problem. What is going on with this article?

React Native for Windows

More than 3 years have passed since last update.

環境

  • Windows10
  • react-native @0.32.0
  • Android Studio 2.1.3

概要

とりあえずAndroidで動いたので記録しておきます。

https://facebook.github.io/react-native/docs/getting-started.html#content
を参考に進めます。

bash使っているとハマった所がいくつかあったので素直にPowerShell使うと良いと思います。

インストール

管理者権限に注意してください。
Chocolatey入っていない人は入れてください。
また、結構前に入れた場合はChocolatey自体のバージョンを上げないとpython2が入りませんでした。

choco install nodejs.install
choco install python2
npm install -g react-native-cli

Android Studioをインストールします。

プロジェクトの作成

Android Studioプロジェクトを作って動作確認をしてください。

私は、JDK関連のエラー以外は問題ありませんでした。
http://tmegos.hatenablog.jp/entry/AndroidStudioErrorBuildtools24.0.1

実機が無い人はここでエミュレータも作成して起動できるようにしておいてください。

続いてReactの方のプロジェクトも作成します。

$ react-native init AwesomeProject
$ cd AwesomeProject

ビルド

そのままだとビルドが通らなかったのでAndroidStudioの方から設定ファイルをコピーします。

$ cp AndroidStudioProject/local.properties AwesomeProject/android

$ cp -r AndroidStudioProject/gradle AwesomeProject/android/gradle

$ vim AwesomeProject/android/build.gradle
# classpathをAndroidStudioで生成したものへ変更
# classpath 'com.android.tools.build:gradle:1.3.1'

$ vim AwesomeProject/android/app/build.gradle
# compileSdkVersion
# buildToolsVersion
# targetSdkVersion
# 上記の項目をAndroidStudioのものへ変更

この辺りは取りあえずエラーを見て順番に直していったので綺麗じゃないですがご容赦ください。

実行

実機を繋ぐかエミュレータを立ち上げた状態で下記のコマンドを実行すると動作が確認できます。

$ react-native run-android
torini
C++を中心に興味を持った物を触っています。記事を書くまでの試行錯誤はブログで行っています。
https://torini.hateblo.jp/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away