※記事執筆時点でアプリの実行まで達成
　記事中のライブラリ側コード修正はPR出てるようなので修正は不要になるはず。

前提

react-nativeが現時点（2015/09/26）で公式にアプリを開発する環境としてサポートしているのはMacだけ。開発できるアプリの種類はiOSとAndroid。

今回はGithubのIssueでWindowsへの対応が進んでいるとのやり取りを見つけて、「masterをチェックアウトしてインストールしたら動いた」との話が見えたので実際に試した結果を書いていく。

実際にやってみる

事前に必要な物、自分の環境でのバージョン

Windows 7 64bit
git（git version 2.5.0.windows.1）
node.js（v4.1.1）
Android Studio 以下をAndroid SDK Managerでインストールしておく
- Android support repository
- Android support library
Microsoft Visual Studio C++ 2012 for Windows Desktop

インストール

git clone https://github.com/facebook/react-native.git
cd react-native/react-native-cli
npm -g install

npm経由だとうまくインストールできなかった。現状npmに上がってるソースだとWindows対応のための修正はまだ反映されていない？　自分の環境だとwarningが出たがインストール自体は通る模様。

アプリを生成して実行

react-native init InitTestInWindows
cd InitTestInWindows
react-native run-android

PC側でサーバを起動する

コード修正の参考: https://gist.github.com/mqli/e1e6576e9838d885a43a

どうも上のコマンドで本来はPC側にサーバが起動されてアプリはそれを参照して動く事でJSの反映が迅速に行える…という設計らしいがWindowsでは正しく動かない模様。

まず、後記するコマンドでのエラーを回避するため、アプリのディレクトリ内でnode_modules/react-native/local-cli/run-packager.js を以下のコードで置き換え。

'use strict';

var path = require('path');
var child_process = require('child_process');

module.exports = function(newWindow) {
  if (newWindow) {
    child_process.spawnSync('open', [
      path.resolve(__dirname, '..', 'packager', 'launchPackager.command')
    ]);
  } else {
    child_process.spawn('node', [
        path.resolve(__dirname, '..', 'packager', 'packager.js'),
        '--projectRoots',
        process.cwd(),
      ], {stdio: 'inherit'});
  }
};

node_modules/react-native/packager/react-packager/src/DependencyResolver/index.js の defineModuleCode メソッドを以下の内容に修正

function defineModuleCode({moduleName, code, deps}) {
  deps = deps.replace(/\\\\/g,'\\');
  return [
    `__d(`,
    `'${moduleName}',`,
    `${deps},`,
    'function(global, require, module, exports) {',
    `  ${code}`,
    '\n});',
  ].join('');
}

以下のコマンドでアプリ側がJSを取れるようにする。

adb reverse tcp:8081 tcp:8081
react-native start

# コード修正無しだとこのエラーだった
    module.js:338
        throw err;
        ^

正常に動作するとこんな感じ

ハマりポイント

> failed to find Build Tools revision 23.0.1

Android Studioをインストールしただけで一度も起動していないとこのエラーが出る。初回起動時にこのBuild Toolが自動でダウンロードされるので一度起動していると問題なく通る模様。

MSBUILD : error MSB3428: Visual C++ コンポーネント "VCBuild.exe" を読み込めませんでした。

参考: http://blue-goheimochi.hatenablog.com/entry/2015/02/27/%E3%80%90%E8%A7%A3%E6%B1%BA%E6%B8%88%E3%80%91Windows7%E3%81%A7npm_install%E5%AE%9F%E8%A1%8C%E6%99%82%E3%81%AB%E3%82%A8%E3%83%A9%E3%83%BC
参考2: https://github.com/nodejs/node-gyp#installation

64bit環境だと発生する模様。Visual Studioをインストールするのが一番簡単な解決策らしい。32bit環境だと発生しない。

Windows上でreact-nativeを使ってみる

前提