기존 프로젝트에react native 도입

새로 만들기react native 프로젝트가 Android에 native라고 쓰면 쉬워요. 일반적인 상황에서 프로젝트가 이미 존재하는데 어떻게 이미 존재하는 앱에 도입react native합니까?
Prepare your app
우선 당신의 앱에 build.gradle도입react native된jar 패키지

compile "com.facebook.react:react-native:+"

프로젝트의 build.gradle에 로컬react native의 마븐 주소를 추가합니다

repositories {
        jcenter()
        maven {
            // All of React Native (JS, Android binaries) is installed from npm
            url "$projectDir/../../node_modules/react-native/android"
        }
    }

그리고 앱AndroidManifest.xml에 네트워크 권한을 추가하면 보통 존재합니다. 이 부분은 무시할 수 있습니다.

<uses-permission android:name="android.permission.INTERNET" />

Add native code
로컬 코드를 추가하여 react native 시작하고 렌더링을 시작합니다. Activity 시작할 때 ReactRootView 를 만들고, 시작하고 react 주 컨트롤러로 사용합니다.

public class RNTestActivity extends ReactActivity {


    @Override
    protected String getMainComponentName() {
        return "MyAwesomeApp";
    }

    @Override
    protected boolean getUseDeveloperSupport() {
        return BuildConfig.DEBUG;
    }

    @Override
    protected List<ReactPackage> getPackages() {
        return Arrays.<ReactPackage>asList(
                new MainReactPackage()
        );
    }
}

Add JS to your app
프로젝트 루트 파일에서 명령을 실행하려면 다음과 같이 하십시오.

$ npm init
$ npm install --save react-native
$ curl -o .flowconfig https://raw.githubusercontent.com/facebook/react-native/master/.flowconfig

node_modules 파일을 만들고 react-native 의존 패키지를 추가했습니다. 현재 새로 만든 package.json 파일을 열고 scripts 탭에 가입합니다.

"start": "node node_modules/react-native/local-cli/cli.js start"

그리고 index에서.android.js에 관련 코드 쓰기

import React from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View
} from 'react-native';

class MyAwesomeApp extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.hello}>Hello, World</Text>
      </View>
    )
  }
}
var styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
  },
  hello: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
  },
});

AppRegistry.registerComponent('MyAwesomeApp', () => MyAwesomeApp);

토로: react native 0.29에 이르렀는데 결과적으로 원생 프로젝트 도입에서 0.20.1에 불과했고 각종 낙후된jar백, 그리고 각종 버전으로 구성된 가방도 진기한 꽃이었다. 최신과 호환되지 않아서 개인적으로 쓰레기라고 느꼈다. 그런데 다행히 1.0도 안 됐어. 1.0에 이렇게 징그러운 문제가 생기면 허허.
만약 당신이 Method 'void android.support.v4.net.ConnectivityManagerCompat.()' is inaccessible to class 'com.facebook.react.modules.netinfo.NetInfoModule'이 문제를 만났다면 축하합니다. 호환되지 않습니다com.android.support:appcompat-v7:23.2.1com.android.support:appcompat-v7:23.2.1를 com.android.support:appcompat-v7:23.0.1로 변경
만약 당신이 더 많은 기이한 문제에 부딪혔다면 react native앱과 충돌했으니 천천히 해결하세요!