关于React-native移植到安卓上

  官网有已经有相对来说，完整的教程，我这里只是结合大家的经验和错误，再写一篇实用性的。

1.首先用android studio新建一个项目，如果有了就不用新建了

再项目的根目录下打开命令行，或者说直接在android studio中使用Terminal输入npm init ,出现下图

出现这样的，第一个是项目名，比如我写test,第二是版本号，后面的就自己看需要了。entry point (入口这里，我写的是index.android.js)，然后一直回车，看到有个要输入yes，就输入yes

第五步，这步是很关键的，不然后来会被坑（当前的最新版本是0.46.4但是会报一个undefined is not  an  Object 。。。。的错，等会上图，所以我最后使用的是0.44.0的版本，如果你实在想用0.46.4，我有个方法，需要请联系我。）

输入Terminal 里输入npm install --save react@16.0.0-alpha.6 react-native@0.44.0  然后等一会

好的，这里完了之后工程里会多出node_modules。

第六步

输入curl -o .flowconfig https://raw.githubusercontent.com/facebook/react-native/master/.flowconfig 等一下

第七步

打开根目录的package.json在srcipts的花括号中加上

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

那个test可以不要的。

第九步，在根目录下的build.gradle的allprojects中加上

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

第十步，在app下的build.gradle中加上

  compile "com.facebook.react:react-native:+" // From node_modules.

如果出现这个错误，就在android的花括号里加上

  configurations.all {
            resolutionStrategy.force 'com.google.code.findbugs:jsr305:1.3.9'
        }

×××××××重点坑

第九步和第十步的顺序不要反了，如果你的react-native的包不是你使用的版本，是0.20.0的版本，请检查第九步

我这个就是对了，找到了指定版本

第十一步

接着，在 AndroidManifest.xml 清单文件中声明网络权限:

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

如果需要访问 DevSettingsActivity 界面，也需要在 AndroidManifest.xml 中声明:

<activity android:name="com.facebook.react.devsupport.DevSettingsActivity" />

接着在根目录下创建一个indrx.android.js

'use strict';import React from 'react';import {  AppRegistry,  StyleSheet,  Text,  View} from 'react-native';class HelloWorld extends React.Component {  render() {    return (      <View>        <Text>Hello, World</Text>      </View>    )  }}/*这里的填写你刚刚第二步npm init的那个名称*/AppRegistry.registerComponent('test', () => HelloWorld);

接着，改造Mainactivity,当然你可以新建一个然后从主界面跳转到这个页面里边为了方便我这里直接改

public class MainActivity extends AppCompatActivity implements DefaultHardwareBackBtnHandler {    private ReactRootView mReactRootView;    private ReactInstanceManager mReactInstanceManager;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        mReactRootView = new ReactRootView(this);        mReactInstanceManager = ReactInstanceManager.builder()                .setApplication(getApplication())                .setBundleAssetName("index.android.bundle")                .setJSMainModuleName("index.android")                .addPackage(new MainReactPackage())                .setUseDeveloperSupport(BuildConfig.DEBUG)                .setInitialLifecycleState(LifecycleState.RESUMED)                .build();        // 注意这里的HelloWorld必须对应“index.android.js”中的        // “AppRegistry.registerComponent()”的第一个参数        mReactRootView.startReactApplication(mReactInstanceManager, "test", null);        setContentView(mReactRootView);    }    @Override    public void invokeDefaultOnBackPressed() {        super.onBackPressed();    }    @Override    protected void onPause() {        super.onPause();        if (mReactInstanceManager != null) {            mReactInstanceManager.onHostPause(this);        }    }    @Override    protected void onResume() {        super.onResume();        if (mReactInstanceManager != null) {            mReactInstanceManager.onHostResume(this, this);        }    }    @Override    protected void onDestroy() {        super.onDestroy();        if (mReactInstanceManager != null) {            mReactInstanceManager.onHostDestroy();        }    }}

有注释那里一个要注意，休息那个test和你的当时npm init的名称一样

ok到了这里，就算完了，请记得络权限一定要配好

在Terminal里输入react-native start

启动成功之后，开始运行你的项目（如果你用的Myappcation这个默认的名字就先删除你的应用在运行避免出错）

这样应该成功了

如果出现错误请给我留言。

如果有个fragmeng.v4什么的错误 将

将报红的那个版本改成23.0.1的试试

.