Android项目接入React Native方案
warning:
这篇文章距离上次修改已过190天,其中的内容可能已经有所变动。
在Android项目中接入React Native可以按照以下步骤进行:
- 确保你的Android Studio和本地开发环境配置正确,包括Node.js和npm。
创建或更新你的React Native项目。在项目根目录下运行以下命令:
npx react-native init MyApp
或者如果已经有一个React Native项目,确保它能正常运行。
- 打开一个现有的Android项目,或者创建一个新的项目。
- 将React Native项目中的
android
目录复制到你的Android项目根目录下。 修改你的主module的
build.gradle
文件,确保它继承自ReactNativeHost
:import com.facebook.react.ReactNativeHost; import com.facebook.react.ReactPackage; import com.facebook.react.shell.MainReactPackage; public class MyApplication extends Application implements ReactApplication { private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) { @Override public boolean getUseDeveloperSupport() { return BuildConfig.DEBUG; } @Override protected List<ReactPackage> getPackages() { return Arrays.<ReactPackage>asList( new MainReactPackage() ); } }; @Override public ReactNativeHost getReactNativeHost() { return mReactNativeHost; } // ... 其他的Application代码 }
修改你的主module的
AndroidManifest.xml
文件,确保它包含ReactActivity
和ReactApplication
的声明:<application ... android:label="@string/app_name" android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" android:theme="@style/AppTheme"> ... <activity android:name="com.facebook.react.ReactActivity" ...> ... </activity> </application>
在主module的
build.gradle
中添加React Native依赖:dependencies { implementation "com.facebook.react:react-native:+" // 或指定版本号 // ... 其他的依赖 }
将React Native的入口Activity设置为主Activity,在
AndroidManifest.xml
中:<activity android:name=".MainActivity" android:label="@string/app_name" android:theme="@style/Theme.App.SplashScreen" android:configChanges="keyboardShow|keyboardHide|orientation|screenSize"> <!-- ...其他配置 --> </activity>
- 将React Native的图标和启动屏幕等资源复制到你的项
评论已关闭