[React Nativeノート]いくつかのコマンドラインツールの役割メモ

8693 ワード


Requirements

  • OS X - This guide assumes OS X which is needed for iOS development.
  • Homebrew is the recommended way to install Watchman and Flow.
  • Install Node.js 4.0 or newer.
  • Install nvm with its setup instructions here. Then run  nvm install node && nvm alias default node , which installs the latest version of Node.js and sets up your terminal so you can run it by typing  node . With nvm you can install multiple versions of Node.js and easily switch between them.
  • New to npm?

  • brew install watchman . We recommend installing watchman, otherwise you might hit a node file watching bug.
  • brew install flow , if you want to use flow.

  • We recommend periodically running  brew update && brew upgrade  to keep your programs up-to-date.
    Homebrew:  Linux yum , brew
    NPM(node package manager), node 。 , node , : 、 、 、 、 、 。
    ( :https://github.com/creationix/nvm#installation)
    npm install XXX
    npm uninstall XXX
    -g  , 

    iOS Setup


    Xcode 7.0 or higher is required. It can be installed from the App Store.

    Android Setup


    To write React Native apps for Android, you will need to install the Android SDK (and an Android emulator if you want to work on your app without having to use a physical device). See Android setup guide for instructions on how to set up your Android environment.
    NOTE: There is experimental Windows and Linux support for Android development.

    Quick start


    Install the React Native command line tools:
    $ npm install -g react-native-cli
    
    cli ?

    NOTE: If you see the error,  EACCES: permission denied , please run the command:  sudo npm install -g react-native-cli .
    Create a React Native project:
    $ react-native init AwesomeProject
    

    To run the iOS app:
  • $ cd AwesomeProject
  • Open  ios/AwesomeProject.xcodeproj  and hit run in Xcode.
  • Open  index.ios.js  in your text editor of choice and edit some lines.
  • Hit ⌘-R in your iOS simulator to reload the app and see your change!

  • Note: If you are using an iOS device, see the Running on iOS Device page.
    To run the Android app:
  • $ cd AwesomeProject
  • $ react-native run-android
  • Open  index.android.js  in your text editor of choice and edit some lines.
  • Press the menu button (F2 by default, or ⌘-M in Genymotion) and select Reload JS to see your change!
  • Run  adb logcat *:S ReactNative:V ReactNativeJS:V  in a terminal to see your app's logs

  • Note: If you are using an Android device, see the Running on Android Device page.
    Congratulations! You've successfully run and modified your first React Native app.
    If you run into any issues getting started, see the troubleshooting page.

    Adding Android to an existing React Native project


    If you already have a (iOS-only) React Native project and want to add Android support, you need to execute the following commands in your existing project directory:
  • Update the  react-native  dependency in your  package.json  file to the latest version
  • $ npm install
  • $ react-native android

  • Upgrading 


    Edit on GitHub
    Upgrading to new versions of React Native will give you access to more APIs, views, developer tools and other goodies. Because React Native projects are essentially made up of an Android project, an iOS project and a JavaScript project, all combined under an npm package, upgrading can be rather tricky. But we try to make it easy for you. Here's what you need to do to upgrade from an older version of React Native:

    1. Upgrade the  react-native  dependency 


    Note the latest version of the  react-native  npm package from here (or use  npm info react-native  to check):
    https://www.npmjs.com/package/react-native
    Now install that version of  react-native  in your project with  npm install --save . For example, to upgrade to the version  0.18 , in a terminal run:
    $ npm install
    --save react
    -native@
    0.18

    2. Upgrade your project templates 


    The new npm package will likely contain updates to the files that are normally generated when you run  react-native init , like the iOS and the Android sub-projects. To get these latest changes, run this in a terminal:
    $ react
    -native upgrade
    This will check your files against the latest template and perform the following:
    If there is a new file in the template, it is simply created.
    If a file in the template is identical to your file, it is skipped.
    If a file is different in your project than the template, you will be prompted; you have options to view a diff between your file and the template file, keep your file or overwrite it with the template version. If you are unsure, press  h  to get a list of possible commands.

    Manual Upgrades 


    Xcode project format is pretty complex and sometimes it's tricky to upgrade and merge new changes.

    From 0.13 to 0.14 


    The major change in this version happened to the CLI (see changelog) and static images (see docs). To use the new asset system in existing Xcode project, do the following:
    Add new "Run Script"step to your project's build phases:
    Set the script to
    .
    .
    /node_modules
    /react
    -native
    /packager
    /react
    -native
    -xcode
    .sh
    Move main.jsbundle to Trash (it will be generated automatically by Xcode using the script above)
    If you installed Node via nvm, you might experience "react-native: command not found". See issues/3974 for workaround and pull/4015 for the fix.