最新版React?Native環(huán)境搭建(親測(cè))

更新時(shí)間：2022年08月26日 14:03:14 作者：xiangzhihong

這篇文章主要介紹了最新版React?Native環(huán)境搭建，React Native的運(yùn)行需要依賴(lài)原生Android和iOS環(huán)境，因此需要分別安裝原生Android和iOS的開(kāi)發(fā)環(huán)境，本文給大家介紹的非常詳細(xì),需要的朋友可以參考下

Node.js：React Native需要借助Node.js來(lái)創(chuàng)建和運(yùn)行JavaScript代碼。
原生開(kāi)發(fā)工具及環(huán)境：React Native的運(yùn)行需要依賴(lài)原生Android和iOS環(huán)境，因此需要分別安裝原生Android和iOS的開(kāi)發(fā)環(huán)境。
其他開(kāi)發(fā)工具：代碼編輯器Visual Studio Code或WebStorm，遠(yuǎn)程調(diào)試具Chrome瀏覽器等。

一、基礎(chǔ)環(huán)境

1.1 安裝Node.js

首先，我們需要安裝Homebrew，Homebrew是一款Mac OS平臺(tái)下的軟件包管理工具，擁有安裝、卸載、更新、查看、搜索等很多實(shí)用的功能，Homebrew的安裝命令如下：

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

安裝完Homebrew之后，接下來(lái)就是安裝Node 、Watchman和 Yarn等必須的工具。

brew install node
brew install watchman
# 使用nrm工具切換淘寶源
npx nrm use taobao

npm install -g yarn

需要注意的是，如果還在使用舊版本React Native工具（0.60.0版本以下），為了避免沖突，請(qǐng)使用下面的命令先卸載。 npm uninstall -g react-native-cli

1.2 添加Android原生環(huán)境

由于React Native項(xiàng)目的編譯運(yùn)行需要依賴(lài)原生平臺(tái)，所以在搭建React Native開(kāi)發(fā)環(huán)境過(guò)程中，需要事先搭建好原生Android和iOS的開(kāi)發(fā)環(huán)境。

在搭建原生Android開(kāi)發(fā)環(huán)境過(guò)程中，由于Android項(xiàng)目的開(kāi)發(fā)和運(yùn)行需要依賴(lài)Java環(huán)境，如果還沒(méi)有安裝Java環(huán)境，可以從JDK官網(wǎng)下載操作系統(tǒng)對(duì)應(yīng)的JDK版本然后進(jìn)行安裝。安裝成功之后，可以使用java -version命令來(lái)驗(yàn)證Java開(kāi)發(fā)環(huán)境，如下圖所示。

同時(shí)，為了方便后面項(xiàng)目中使用Java的命令行，還需要在.bash_profile文件中配置環(huán)境變量，如下所示。

# 如果你不是通過(guò)Android Studio安裝的sdk，則其路徑可能不同，請(qǐng)自行確定清楚
export ANDROID_HOME=/Users/XXX/Library/Android/sdk
export PATH=${PATH}:${ANDROID_HOME}/tools
export PATH=${PATH}:${ANDROID_HOME}/platform-tools
export PATH=${PATH}:${ANDROID_HOME}/emulator
export PATH=${PATH}:${ANDROID_HOME}/tools/bin

如果配置文件使用的是~/.zshrc，那么可以使用下面的命令使上面的配置生效。

source ～/.zshrc

接下來(lái)，我們還需要安裝Android開(kāi)發(fā)工具Android Studio和Android開(kāi)發(fā)套件Android SDK Tools。

首先，從Android官網(wǎng)下載最新的Android Studio，安裝完成之后，第一次啟動(dòng)會(huì)自動(dòng)下載Android SDK，下載Android SDK需要在Android Studio的設(shè)置板中配置Android SDK Tools的路徑。

同樣，為了方便在項(xiàng)目中使用Android命令行工具，還需要配置一下Android系統(tǒng)環(huán)境變量。

export ANDROID_HOME="/Users/xxx/Android/sdk"    
export PATH=${PATH}:${ANDROID_HOME}/tools						
export PATH=${PATH}:${ANDROID_HOME}/platform-tools

1.3 添加iOS原生環(huán)境

眾所周知，開(kāi)發(fā)iOS應(yīng)用需要macOS操作系統(tǒng)支持，所以如果經(jīng)濟(jì)條件允許最好準(zhǔn)備一臺(tái)Mac電腦。也只有這樣，才能使用React Native開(kāi)發(fā)可以同時(shí)運(yùn)行在iOS和Android設(shè)備上的跨平臺(tái)應(yīng)用，發(fā)揮React Native跨平臺(tái)應(yīng)用開(kāi)發(fā)的優(yōu)勢(shì)。

由于使用React Native開(kāi)發(fā)iOS端的應(yīng)用時(shí)需要Xcode 7及更高版本的支持，如果本地還沒(méi)有安裝Xcode應(yīng)用程序，可以從App Store上下載最新的Xcode進(jìn)行安裝，

需要說(shuō)明的是，Xcode安裝程序必須通過(guò)Apple官網(wǎng)或者App Store進(jìn)行下載，否則容易出現(xiàn)代碼植入和代碼泄漏的風(fēng)險(xiǎn)。比如，2015年9月發(fā)生的XcodeGhost非法代碼植入事件，就是因?yàn)殚_(kāi)發(fā)者使用的是非官方的Xcode安裝程序引起的。

同時(shí)，React Native項(xiàng)目的原生iOS部分使用的是CocoaPods來(lái)管理第三方依賴(lài)庫(kù)，所以在搭建iOS開(kāi)發(fā)環(huán)境時(shí)還需要安裝CocoaPods庫(kù)管理工具。如果還沒(méi)有安裝CocoaPods，可以使用下面的命令進(jìn)行安裝。

brew install cocoapods

由于React Native項(xiàng)目的運(yùn)行需要依賴(lài)ruby的2.7.5版本，所以請(qǐng)確保本地已經(jīng)安裝了ruby依賴(lài)。如果本地安裝了多個(gè)ruby版本，那么可以使用下面的命令進(jìn)行切換。

rvm use ruby-2.7.5 --default

二、創(chuàng)建示例項(xiàng)目

2.1 創(chuàng)建項(xiàng)目

React Native支持使用命令和IDE集成開(kāi)發(fā)工具兩種方式來(lái)創(chuàng)建項(xiàng)目。其中，使用命令行方式初始化React Native項(xiàng)目如下所示。

npx react-native init RNDemos

需要注意的是，初始化React Native項(xiàng)目時(shí)，項(xiàng)目名稱(chēng)不能包含中文、空格和特殊符號(hào)，也不能使用JavaScript關(guān)鍵字作為項(xiàng)目名，如 class、native、new等。同時(shí)，React Native在初始化項(xiàng)目時(shí)還支持指定版本和項(xiàng)目模板，如下所示。

//指定版本
npx react-native init AwesomeProject --version 0.66.0   
//指定模版
npx react-native init AwesomeTSProject --template react-native-template-typescript

當(dāng)然，除了命令行方式外，我們更推薦使用VSCode或WebStrom等可視化編輯工具來(lái)創(chuàng)建React Native項(xiàng)目。

等待React Native項(xiàng)目構(gòu)建成功之后，系統(tǒng)還會(huì)自動(dòng)安裝項(xiàng)目所需的第三方依賴(lài)庫(kù)。接著，再使用VSCode或WebStrom打開(kāi)React Native項(xiàng)目，如下圖所示。

2.2 運(yùn)行項(xiàng)目

運(yùn)行React Native項(xiàng)目之前，需要配置好原生開(kāi)發(fā)環(huán)境。即運(yùn)行iOS 需要正確安裝和配置Xcode工具，運(yùn)行Android App需要正確安裝和配置Android Studio和Android SDK Tools。同時(shí)，為了能夠正常的運(yùn)行項(xiàng)目，還需要在項(xiàng)目運(yùn)行之前啟動(dòng)模擬器或者真機(jī)設(shè)備。啟動(dòng)模擬器或真機(jī)后，我們可以使用如下的命令來(lái)查看連接情況。

xcrun simctl list devices   //查看可用的iOS設(shè)備
adb devices            //查看可用的Android設(shè)備

然后，在項(xiàng)目的根目錄運(yùn)行執(zhí)行如下命令即可啟動(dòng)React Native項(xiàng)目。

//啟動(dòng)iOS
yarn ios或者yarn react-native run-ios
//啟動(dòng)Android
yarn android或者yarn react-native run- android

此命令會(huì)對(duì)項(xiàng)目的原生部分進(jìn)行編譯，同時(shí)在后臺(tái)啟動(dòng)Metro服務(wù)對(duì) JavaScript代碼進(jìn)行實(shí)時(shí)打包處理。當(dāng)然，Metro服務(wù)也可以使用yarn start命令單獨(dú)啟動(dòng)。如果此命令無(wú)法正常運(yùn)行，可以使用Android Studio或者Xcode打開(kāi)對(duì)應(yīng)的原生工程來(lái)查看報(bào)錯(cuò)信息。如果沒(méi)有任何錯(cuò)誤提示，那么運(yùn)行效果如下圖所示。

2.3 調(diào)試項(xiàng)目

調(diào)試是軟件開(kāi)發(fā)過(guò)程中重要的步驟，也是保證軟件質(zhì)量的重要手段。應(yīng)用調(diào)試不僅可以幫助開(kāi)發(fā)者快讀的定位軟件中存在的問(wèn)題，同時(shí)也是初學(xué)者快速理解軟件功能的重要途徑。

由于React Native項(xiàng)目主要使用React前端語(yǔ)言進(jìn)行開(kāi)發(fā)，所以調(diào)試React Native需要使用到Chrome的DevTools，而Chrome瀏覽器默認(rèn)就集成了這一工具。React Native集成了對(duì)Chrome的DevTools的支持，開(kāi)發(fā)者可以很容易地使用它調(diào)試React Native應(yīng)用。

使用真機(jī)開(kāi)發(fā)時(shí)，調(diào)試應(yīng)用只需要晃動(dòng)下設(shè)備即可打開(kāi)調(diào)試選項(xiàng)。如果開(kāi)發(fā)使用的是模擬器，那么可以使用快捷鍵來(lái)打開(kāi)調(diào)試功能，Android模擬器調(diào)試的快捷鍵是【Command +M】，iOS模擬器的快捷鍵是【Command +D】，如下圖所示。

需要說(shuō)明的是，如果是使用真機(jī)進(jìn)行調(diào)試，需要調(diào)試的真機(jī)和開(kāi)發(fā)程序的電腦處于同一個(gè)Wi-Fi網(wǎng)絡(luò)，否則將會(huì)出現(xiàn)無(wú)法連接的情況。接著，只需要點(diǎn)擊屏幕上的【Debug】選項(xiàng)即可開(kāi)啟遠(yuǎn)端調(diào)試功能。開(kāi)啟遠(yuǎn)端調(diào)試時(shí)，系統(tǒng)會(huì)自動(dòng)打開(kāi)Chrome瀏覽器的調(diào)試界面，如下圖所示。

然后，依次點(diǎn)擊【Chrome菜單】→【選擇更多工具】→【選擇開(kāi)發(fā)者工具】，或者使用快捷鍵【Command +Option +I】即可打開(kāi)調(diào)試窗口，開(kāi)始調(diào)試。

如果大家有前端開(kāi)發(fā)的基礎(chǔ)，那么React Native開(kāi)發(fā)可以做到快速上手。

三、集成到原生應(yīng)用

3.1 集成到原生Android應(yīng)用

首先，在原生Android項(xiàng)目的根目錄下執(zhí)行yarn init命令創(chuàng)建一個(gè)名為package.json的空文件。然后，根據(jù)提示輸入對(duì)應(yīng)的配置信息。等待命令執(zhí)行完成之后，會(huì)發(fā)現(xiàn)原生Android項(xiàng)目的根目錄多了一個(gè)package.json文件，該文件就是。接著，使用如下命令添加React和React Native運(yùn)行環(huán)境的支持腳本。

yarn add react react-native

執(zhí)行完命令后，會(huì)發(fā)現(xiàn)Android項(xiàng)目的根目錄下多了一個(gè)node_modules文件夾，里面包含了React Native開(kāi)發(fā)也運(yùn)行所需的依賴(lài)模塊，原則上這個(gè)文件目錄是不能復(fù)制、移動(dòng)和修改的。并且，node_modules文件夾中的內(nèi)容是不需要上傳倉(cāng)庫(kù)的，所以還需要將node_modules文件目錄記錄到.gitignore文件中。接下來(lái)，使用文本編輯器打開(kāi)package.json文件，配置React Native的啟動(dòng)腳本，如下代碼。

"scripts": {
    "start": "yarn react-native start",
  },

到此，React Native所需的環(huán)境就配置完成了。此時(shí)，package.json文件的全部?jī)?nèi)容如下所示。

{
  "name": "AndroidDemo",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "dependencies": {
    "react": "^17.0.1",
    "react-native": "^0.66.0"
  },
  "scripts": {
    "start": "yarn react-native start"
  }
}

然后，在Android項(xiàng)目的根目錄下創(chuàng)建一個(gè)index.js文件，用于作為React Native模塊的入口，代碼如下。

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

class HelloWorld extends React.Component {
    render() {
        return (
            <View style={styles.container}>
                    <Text style={styles.hello}>Hello, React Native</Text>
            </View>
        );
    }
}

const styles = StyleSheet.create({
    container: {
        flex: 1,
        justifyContent: 'center',
    },
    hello: {
        fontSize: 20,
        textAlign: 'center',
        margin: 10,
    },
});

AppRegistry.registerComponent('MyReactNativeApp', () => HelloWorld);

接下來(lái)，我們使用Android Studio打開(kāi)原生Android項(xiàng)目，并在app目錄的build.gradle文件的dependencies代碼塊中添加React Native和JSC引擎依賴(lài)，如下所示。

dependencies {
    ...
    implementation "com.facebook.react:react-native:+" 
    implementation "org.webkit:android-jsc:+"
}

如果不指定依賴(lài)的版本，那么默認(rèn)使用的是package.json文件中React Native對(duì)應(yīng)的版本。然后，在項(xiàng)目的build.gradle文件的allprojects代碼塊中添加React Native和JSC引擎的路徑，如下所示。

allprojects {
    repositories {
        maven {
            url "$rootDir/../node_modules/react-native/android"
        }
        maven {
            url("$rootDir/../node_modules/jsc-android/dist")
        }
        ...
    }
    ...
}

然后，打開(kāi)AndroidManifest.xml清單文件，添加網(wǎng)絡(luò)權(quán)限代碼，如下所示。

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

如果需要訪問(wèn)開(kāi)發(fā)者調(diào)試菜單，還需要在AndroidManifest.xml清單文件中注冊(cè)DevSettingsActivity界面，如下所示。

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

接下來(lái)，新建一個(gè)Activity作為React Native的容器頁(yè)面，并在Activity中創(chuàng)建一個(gè)ReactRootView對(duì)象，然后在這個(gè)對(duì)象之中啟動(dòng)React Native應(yīng)用代碼，如下所示。

public class MyReactActivity extends Activity implements DefaultHardwareBackBtnHandler {

    private ReactRootView mReactRootView;
private ReactInstanceManager mReactInstanceManager;

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        SoLoader.init(this, false);
        mReactRootView = new ReactRootView(this);
        mReactInstanceManager = ReactInstanceManager.builder()
                .setApplication(getApplication())
                .setCurrentActivity(this)
                .setBundleAssetName("index.android.bundle")
                .setJSMainModulePath("index")
                .addPackage(new MainReactPackage())
                .setUseDeveloperSupport(BuildConfig.DEBUG)
                .setInitialLifecycleState(LifecycleState.RESUMED)
                .build();
        mReactRootView.startReactApplication(mReactInstanceManager, "MyReactNativeApp", null);
        setContentView(mReactRootView);
    }

    @Override
    public boolean onKeyUp(int keyCode, KeyEvent event) {
        if (keyCode == KeyEvent.KEYCODE_MENU && mReactInstanceManager != null) {
            mReactInstanceManager.showDevOptionsDialog();
            return true;
        }
        return super.onKeyUp(keyCode, event);
    }
}

可以使用Android Studio的【Alt + Enter】快捷鍵自動(dòng)導(dǎo)入缺失的語(yǔ)句，并且BuildConfig是編譯時(shí)自動(dòng)生成的，無(wú)需額外引入。由于React Native應(yīng)用調(diào)試還需要懸浮窗權(quán)限，所以在需要在Android項(xiàng)目的代碼中添加懸浮窗權(quán)限邏輯，如下所示。

private final int OVERLAY_PERMISSION_REQ_CODE = 1; 

private void requestPermission() {
        if (Build.VERSION.SDK_INT &gt;= Build.VERSION_CODES.M) {
            if (!Settings.canDrawOverlays(this)) {
                Intent intent = new Intent(Settings.ACTION_MANAGE_OVERLAY_PERMISSION,
                        Uri.parse("package:" + getPackageName()));
                startActivityForResult(intent, OVERLAY_PERMISSION_REQ_CODE);
            }
        }
}

@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
    if (requestCode == OVERLAY_PERMISSION_REQ_CODE) {
        if (Build.VERSION.SDK_INT &gt;= Build.VERSION_CODES.M) {
            if (!Settings.canDrawOverlays(this)) {
                // SYSTEM_ALERT_WINDOW permission not granted
            }
        }
    }
    mReactInstanceManager.onActivityResult( this, requestCode, resultCode, data );
}
復(fù)制代碼

接下來(lái)，我們?cè)贏ndroidManifest.xml清單文件中注冊(cè)MyReactActivity，此處我們直接使用MyReactActivity替換MainActivity作為應(yīng)用的主頁(yè)面，如下所示。

&lt;activity
      android:name=".MyReactActivity"
      android:theme="@style/Theme.AppCompat.Light.NoActionBar"&gt;
&lt;intent-filter&gt;
          &lt;action android:name="android.intent.action.MAIN" /&gt;
          &lt;category android:name="android.intent.category.LAUNCHER" /&gt;
      &lt;/intent-filter&gt;
&lt;/activity&gt;
復(fù)制代碼

完成上述操作后，我們?cè)趕rc/main目錄下創(chuàng)建一個(gè)assets資源文件夾，然后執(zhí)行如下打包命令。

react-native bundle --platform android --entry-file index.js --bundle-output app/src/main/assets/index.android.bundle --dev false
復(fù)制代碼

接著，執(zhí)行yarn start命令啟動(dòng)React Native所需的服務(wù)，然后重新運(yùn)行原生Android項(xiàng)目即可看到效果，如圖下圖所示。

3.2 集成到原生iOS應(yīng)用

在原生iOS項(xiàng)目中集成React Native的步驟和Android是一樣的。首先，需要在原生iOS項(xiàng)目的根目錄下創(chuàng)建一個(gè)package.json文件，然后添加如下腳本代碼。

{
  "name": "RNiOS",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "dependencies": {
    "react": "^17.0.1",
    "react-native": "^0.66.0"
  },
  "scripts": {
    "start": "yarn react-native start"
  }
}

然后，執(zhí)行yarn install命令安裝React Native需要的依賴(lài)包。接著，我們?cè)傩陆ㄒ粋€(gè)index.js文件作為React Native部分的入口，代碼如下。

import React from 'react';
import {AppRegistry,StyleSheet,Text,View} from 'react-native';
class ReactHost extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <Text style={styles.hello}>2048 High Scores</Text>
      </View>
    )
  }
}
AppRegistry.registerComponent('MyReactNativeApp', () => ReactHost);

然后，在iOS項(xiàng)目的根目錄下使用pod init命令創(chuàng)建一個(gè)Podfile文件，添加如下依賴(lài)包腳本。

# target的名字一般與你的項(xiàng)目名字相
  pod 'FBLazyVector', :path => "../node_modules/react-native/Libraries/FBLazyVector"
  pod 'FBReactNativeSpec', :path => "../node_modules/react-native/Libraries/FBReactNativeSpec"
  pod 'RCTRequired', :path => "../node_modules/react-native/Libraries/RCTRequired"
  pod 'RCTTypeSafety', :path => "../node_modules/react-native/Libraries/TypeSafety"
  pod 'React', :path => '../node_modules/react-native/'
  pod 'React-Core', :path => '../node_modules/react-native/'
  pod 'React-CoreModules', :path => '../node_modules/react-native/React/CoreModules'
  pod 'React-Core/DevSupport', :path => '../node_modules/react-native/'
  pod 'React-RCTActionSheet', :path => '../node_modules/react-native/Libraries/ActionSheetIOS'
  pod 'React-RCTAnimation', :path => '../node_modules/react-native/Libraries/NativeAnimation'
  pod 'React-RCTBlob', :path => '../node_modules/react-native/Libraries/Blob'
  pod 'React-RCTImage', :path => '../node_modules/react-native/Libraries/Image'
  pod 'React-RCTLinking', :path => '../node_modules/react-native/Libraries/LinkingIOS'
  pod 'React-RCTNetwork', :path => '../node_modules/react-native/Libraries/Network'
  pod 'React-RCTSettings', :path => '../node_modules/react-native/Libraries/Settings'
  pod 'React-RCTText', :path => '../node_modules/react-native/Libraries/Text'
  pod 'React-RCTVibration', :path => '../node_modules/react-native/Libraries/Vibration'
  pod 'React-Core/RCTWebSocket', :path => '../node_modules/react-native/'

  pod 'React-cxxreact', :path => '../node_modules/react-native/ReactCommon/cxxreact'
  pod 'React-jsi', :path => '../node_modules/react-native/ReactCommon/jsi'
  pod 'React-jsiexecutor', :path => '../node_modules/react-native/ReactCommon/jsiexecutor'
  pod 'React-jsinspector', :path => '../node_modules/react-native/ReactCommon/jsinspector'
  pod 'ReactCommon/callinvoker', :path => "../node_modules/react-native/ReactCommon"
  pod 'ReactCommon/turbomodule/core', :path => "../node_modules/react-native/ReactCommon"
  pod 'Yoga', :path => '../node_modules/react-native/ReactCommon/yoga'

  pod 'DoubleConversion', :podspec => '../node_modules/react-native/third-party-podspecs/DoubleConversion.podspec'
  pod 'glog', :podspec => '../node_modules/react-native/third-party-podspecs/glog.podspec'
  pod 'Folly', :podspec => '../node_modules/react-native/third-party-podspecs/Folly.podspec'

end

需要說(shuō)明的是，上面的腳本是啟動(dòng)React Native部分所必須的，并且每個(gè)版本會(huì)有細(xì)微的區(qū)別。完成上述配置之后，使用pod install命令安裝所需的依賴(lài)包。接著，使用Xcode打開(kāi)原生iOS項(xiàng)目，在ViewController.m啟動(dòng)文件中添加如下代碼。

- (IBAction)highScoreButtonPressed:(id)sender {
    NSLog(@"High Score Button Pressed");
    NSURL *jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.bundle?platform=ios"];

    RCTRootView *rootView =
      [[RCTRootView alloc] initWithBundleURL: jsCodeLocation
                                  moduleName: @"RNHighScores"
                           initialProperties:
                             @{
                               @"scores" : @[
                                 @{
                                   @"name" : @"Alex",
                                   @"value": @"42"
                                  },
                                 @{
                                   @"name" : @"Joel",
                                   @"value": @"10"
                                 }
                               ]
                             }
                               launchOptions: nil];
    UIViewController *vc = [[UIViewController alloc] init];
    vc.view = rootView;
    [self presentViewController:vc animated:YES completion:nil];
}

當(dāng)上面的代碼被執(zhí)行時(shí)，應(yīng)用會(huì)打開(kāi)React Native的index.js頁(yè)面，并且將從原生iOS部分獲取的數(shù)據(jù)也顯示到屏幕上。最后，使用yarn start命令啟動(dòng)Node.js服務(wù)，重新運(yùn)行原生iOS項(xiàng)目即可看到效果，如圖下圖所示。

到此這篇關(guān)于最新版React Native環(huán)境搭建()的文章就介紹到這了,更多相關(guān)React Native環(huán)境搭建內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

軟件下載

源碼下載

軟件編程

網(wǎng)絡(luò)編程

在線工具

數(shù)據(jù)庫(kù)

CMS

常用工具

最新版React?Native環(huán)境搭建(親測(cè))

目錄

一、基礎(chǔ)環(huán)境

1.1 安裝Node.js

1.2 添加Android原生環(huán)境

1.3 添加iOS原生環(huán)境

二、創(chuàng)建示例項(xiàng)目

2.1 創(chuàng)建項(xiàng)目

2.2 運(yùn)行項(xiàng)目

2.3 調(diào)試項(xiàng)目

三、集成到原生應(yīng)用

3.1 集成到原生Android應(yīng)用

3.2 集成到原生iOS應(yīng)用

相關(guān)文章

最新評(píng)論

大家感興趣的內(nèi)容

最近更新的內(nèi)容

常用在線小工具

最新版React?Native環(huán)境搭建(親測(cè))

目錄

一、基礎(chǔ)環(huán)境

1.1 安裝Node.js

1.2 添加Android原生環(huán)境

1.3 添加iOS原生環(huán)境

二、創(chuàng)建示例項(xiàng)目

2.1 創(chuàng)建項(xiàng)目

2.2 運(yùn)行項(xiàng)目

2.3 調(diào)試項(xiàng)目

三、集成到原生應(yīng)用

3.1 集成到原生Android應(yīng)用

3.2 集成到原生iOS應(yīng)用

相關(guān)文章

最新評(píng)論

大家感興趣的內(nèi)容

最近更新的內(nèi)容

常用在線小工具

三、集成到原生應(yīng)用