Android開發 React Native項目創建及環境搭建

  先來看一下RNDemo效果吧，這裏不得不吐槽一下，說實話RN畢竟屬於js性能沒有原生流暢看一下效果就知道了：

  首先你需要安裝NodeJS，因爲React Native（簡稱RN，後面我就都用RN稱呼了）本身就是使用Javascript語言和React語言爲基礎的，後面你會發現所有文件都是以.js爲後綴名的，所以需要NodeJS來編譯文件，而且後面會介紹到，我們還需要使用Node命令來初始化RN項目以及下載所有需要的node_modules包，好了廢話不多說咱們開始吧。

  如果安裝完了NodeJS，你就可以使用npm命令了，否則找不到該命令，我先來介紹如何在Android Studio使用RN。

  1、使用Android Studio創建一個空項目例如"RNDemo"，不過創建Android項目的時候需要注意的是：Minimum SDK當前最低兼 容支持API16，所以創建的時候最好mini API16以上。

  2、Android Demo項目創建完成之後，點擊Terminal（注意需要在根目錄下執行）

    接下來執行下面代碼： 

npm init

npm install --save react react-native

   注意：

   init 主要根據提醒生成package.json文件

   install --save react react-native 安裝React 和React Native

   然後在瀏覽器打開https://raw.githubusercontent.com/facebook/react-native/master/.flowconfig

   將該文件下載下來放到根目錄下：

    3、添加及修改配置內容

1.修改package.json文件

2.創建入口js文件

3.添加build文件配置

build.gradle(Module:app)添加：

defaultConfig {
       ...
        ndk {
            abiFilters "armeabi-v7a", "x86"
        }
    }

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

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

build.gradle(Project:Application)添加：

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

4.manifest文件配置：

5.Activity繼承ReactActivity，Application實現ReactApplication

把MyApplication添加到manifest的name中去。

一切已經準備就緒，開始run 'App'，然後在Terminal中輸入命令react-native start，注意（如果是真機需要在這之前先執行adb reverse tcp:8081 tcp:8081保證8081端口與真機連接請不要佔用端口號）

如果你需要打包App，那麼首先你需要在android/app/src/main下新建assets目錄，然後在Terminal命令行輸入：

react-native bundle --platform android --dev false --entry-file index.android.js --bundle-output app/src/main/assets/index.android.bundle --assets-dest app/src/main/res/

            然後你會發現在你創建的assets目錄下會產生兩個bundle文件就可以打包啦：

4、最後介紹RN如何編程

首先你需要了解一下react語言以及JavaScript語言基礎，然後最好安裝Webstorm，其他軟件也能用但是，目前Webstorm是最流行以及最好用的，所有基本操作類似AndroidStudio開發工具用起來更順手推薦Webstorm，而且Webstorm可以直接創建React Native項目項目自動創建了Android和IOS項目可直接使用哦：

源碼