web-dev-qa-db-ja.com

React NativeはWindowsでの開発をまだサポートしていませんか?

多くの人々がReact NativeがようやくサポートするようになりましたAndroidも非常に興奮しています。

しかし、Windowsマシンでの開発をサポートしていないという大きな失望があります-多くの場合、メインOSを変更できないだけの大企業でのReact Nativeの取り込みを妨げます。

少し掘り下げましたが、とにかくWindowsで実行するのは難しくないようです。

スポーンからrequirejs.exec in react-native-cliindex.jsに変更するには次のようにします。

    spawn.exec(cmd + ' ' + args.join(' '), function(code, output){
      if (code !== 0) {
        cb(new Error('Command exited with a non-zero status ' + code + '\n' + cmd + ' ' + args.replace(',', ' ')));
      } else {
        cb(null);
      }
    });
    //var proc = spawn(cmd, args, {stdio: 'inherit'});
    //proc.on('close', function(code) {
    //  if (code !== 0) {
    //    cb(new Error('Command exited with a non-zero status'));
    //  } else {
    //    cb(null);
    //  }
    //});

この変更により、目に見えるエラーなしでreact-native run-Androidを実行できます。エミュレーターとアプリを起動します。

Windowsで実行するために最後に欠けているのは、開発サーバーが機能しないのはなぜですか、またはアプリがそれに接続できないのはなぜですか?

「JSバンドルをダウンロードできません...」という死の赤い画面が表示されます。 react-native run-Androidを出力しても、Starting JS server...は起動に失敗したようです。下部の完全な出力を参照してください。

それを修正するのを手伝ってくれる人がいますか?

ありがとうございました

    Y:\Mobile>react-native run-Android
    Starting JS server...
        Building and installing the app on the device (cd Android && gradlew.bat installDebug)...
    :app:preBuild UP-TO-DATE
    :app:preDebugBuild UP-TO-DATE
    :app:checkDebugManifest
        :app:preReleaseBuild UP-TO-DATE
    :app:prepareComAndroidSupportAppcompatV72300Library UP-TO-DATE
    :app:prepareComAndroidSupportSupportV42300Library UP-TO-DATE
    :app:prepareComFacebookFrescoDrawee061Library UP-TO-DATE
    :app:prepareComFacebookFrescoFbcore061Library UP-TO-DATE
    :app:prepareComFacebookFrescoFresco061Library UP-TO-DATE
    :app:prepareComFacebookFrescoImagepipeline061Library UP-TO-DATE
    :app:prepareComFacebookFrescoImagepipelineOkhttp061Library UP-TO-DATE
    :app:prepareComFacebookReactReactNative0110Library UP-TO-DATE
    :app:prepareOrgWebkitAndroidJscR174650Library UP-TO-DATE
    :app:prepareDebugDependencies
        :app:compileDebugAidl UP-TO-DATE
    :app:compileDebugRenderscript UP-TO-DATE
    :app:generateDebugBuildConfig UP-TO-DATE
    :app:generateDebugAssets UP-TO-DATE
    :app:mergeDebugAssets UP-TO-DATE
    :app:generateDebugResValues UP-TO-DATE
    :app:generateDebugResources UP-TO-DATE
    :app:mergeDebugResources UP-TO-DATE
    :app:processDebugManifest UP-TO-DATE
    :app:processDebugResources UP-TO-DATE
    :app:generateDebugSources UP-TO-DATE
    :app:processDebugJavaRes UP-TO-DATE
    :app:compileDebugJavaWithJavac UP-TO-DATE
    :app:compileDebugNdk UP-TO-DATE
    :app:compileDebugSources UP-TO-DATE
    :app:preDexDebug UP-TO-DATE
    :app:dexDebug UP-TO-DATE
    :app:validateDebugSigning
        :app:packageDebug UP-TO-DATE
    :app:zipalignDebug UP-TO-DATE
    :app:assembleDebug UP-TO-DATE
    :app:installDebug
    Installing APK 'app-debug.apk' on 'reactnative(AVD) - 6.0'
    Installed on 1 device.

        BUILD SUCCESSFUL

    Total time: 20.332 secs
    Starting the app (adb Shell am start -n com.mobile/.MainActivity)...
    Starting: Intent { cmp=com.mobile/.MainActivity }

更新

react-native run-Androidが機能するようになった後、開発サーバーを実行しようとしたことの詳細を以下に示します。

私はそれを試しました-しかし、「npm start」は次のように失敗します:

    Y:\Mobile>npm start

    > [email protected] start Y:\Mobile
    > node_modules/react-native/packager/packager.sh

    'node_modules' is not recognized as an internal or external command,
    operable program or batch file.

    npm ERR! Windows_NT 6.3.9600
    npm ERR! argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "start"
    npm ERR! node v4.0.0
    npm ERR! npm  v2.14.2
    npm ERR! code ELIFECYCLE
    npm ERR! [email protected] start: `node_modules/react-native/packager/packager.sh`
    npm ERR! Exit status 1
    npm ERR!
    npm ERR! Failed at the [email protected] start script 'node_modules/react-native/packager/packager.sh'.
    npm ERR! This is most likely a problem with the Mobile package,
    npm ERR! not with npm itself.
    npm ERR! Tell the author that this fails on your system:
    npm ERR!     node_modules/react-native/packager/packager.sh
    npm ERR! You can get their info via:
    npm ERR!     npm owner ls Mobile
    npm ERR! There is likely additional logging output above.

    npm ERR! Please include the following file with any support request:
    npm ERR!     Y:\Mobile\npm-debug.log

次に、react-native startを試しましたが、次のように失敗しました。

    Y:\Mobile>react-native start
    module.js:338
        throw err;
        ^

    Error: Cannot find module 'Y:\Mobile\packager.js'
        at Function.Module._resolveFilename (module.js:336:15)
        at Function.Module._load (module.js:286:25)
        at Function.Module.runMain (module.js:475:10)
        at startup (node.js:117:18)
        at node.js:951:3

それから私はnode node_modules/react-native/packager/packager.jsを試しました。

    Y:\Mobile>node node_modules/react-native/packager/packager.js
     ┌────────────────────────────────────────────────────────────────────────────┐
     │  Running packager on port 8081.                                            │
     │                                                                            │
     │  Keep this packager running while developing on any JS projects. Feel      │
     │  free to close this tab and run your own packager instance if you          │
     │  prefer.                                                                   │
     │                                                                            │
     │  https://github.com/facebook/react-native                                  │
     │                                                                            │
     └────────────────────────────────────────────────────────────────────────────┘
    Looking for JS files in
       Y:\Mobile


    React packager ready.

    [10:43:07 AM] <START> Building Dependency Graph
    [10:43:07 AM] <START> Crawling File System
    [10:43:17 AM] <END>   Crawling File System (10513ms)
    [10:43:17 AM] <START> Building in-memory fs for JavaScript
    [10:43:18 AM] <END>   Building in-memory fs for JavaScript (1116ms)
    [10:43:18 AM] <START> Building in-memory fs for Assets
    [10:43:19 AM] <END>   Building in-memory fs for Assets (1090ms)
    [10:43:19 AM] <START> Building Haste Map
    [10:43:20 AM] <START> Building (deprecated) Asset Map
    [10:43:20 AM] <END>   Building (deprecated) Asset Map (221ms)
    [10:43:20 AM] <END>   Building Haste Map (639ms)
    [10:43:20 AM] <END>   Building Dependency Graph (13360ms)

しかし、その後、死の赤い画面でReload JSを押すと、約30秒後に再び失敗し、開発サーバーコンソールがそれを出力して、開発サーバーを終了します。

    <--- Last few GCs --->

      172210 ms: Scavenge 1402.5 (1455.6) -> 1402.5 (1455.6) MB, 9.6 / 0 ms (+ 2.0 ms in 1 steps since last GC) [allocation failure] [incremental marking delaying mark-sweep].
      173083 ms: Mark-sweep 1402.5 (1455.6) -> 1402.5 (1455.6) MB, 872.5 / 0 ms (+ 3.0 ms in 2 steps since start of marking, biggest step 2.0 ms) [last resort gc].
      173954 ms: Mark-sweep 1402.5 (1455.6) -> 1402.4 (1455.6) MB, 871.1 / 0 ms [last resort gc].


    <--- JS stacktrace --->

    ==== JS stack trace =========================================

    Security context: 0000018472E37349 <JS Object>
        1: join [path.js:~217] [pc=0000039512658044] (this=0000006899C67369 <an Object with map 0000008FE2423E19>)
        2: arguments adaptor frame: 3->0
        3: /* anonymous */(aka /* anonymous */) [Y:\Mobile\node_modules\react-native\packager\react-packager\src\DependencyResolver\DependencyGraph\ResolutionRequest.js:~226] [pc=00000395137E2AFA] (this=0000018472E04131 <undefined>,realModuleN...

    FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - process out of memory

私たちはWindows上でそれを実行するのに非常に近いと思います、私はここで最後の部分で少し助けが必要です。

助けてください

21
Christine

更新:バージョン0.14(2015年10月)の時点で、コミュニティの素晴らしい仕事のおかげでWindows開発が可能になりました( details )。


Windowsはまだ正式にはサポートされていません。 Getting Started のドキュメントを参照してください。

私たちはできるだけ早くリリースを出したいと思い、最初にMac OSに焦点を合わせました。

コミュニティの人々はReact最小限の変更を加えてLinuxで動作するようにネイティブになりました(これらについては近日中に文書化する予定です)。

https://github.com/facebook/react-native/issues/2787

14
Martin Konicek

cygwinをインストールして実行することで修正する方法を見つけました:cd package sh package.sh

私はそれが誰かを助けることを願っています。

2
funerr

ReactWindows は、Windows 10 SDKのサポートを追加します。これにより、以下のアプリを作成できます。

  • ウインドウズ10
  • Windows 10 Mobile
  • Xbox One(UWP)
  • Windows 7および8.1(WPF)
2
ohho