现有Android项目引入ReactNative
来源:互联网 发布:js touch 编辑:程序博客网 时间:2024/05/21 20:22
作者:相濡以沫灬
链接:
http://blog.csdn.net/github_33304260/article/details/76571961
本文由作者投稿发布。
为什么写这篇文章,因为很多时候我们是需要在原Android工程中添加ReactNative,而不是直接react-native init hello来创建工程,而且官网的说明不是很详细,不是完全针对安卓的,所以本文的必要性不言而喻。
新建Android原生工程,这里就不详细叙述了,如下图:
点击finish到这里Android原生工程创建完成。
运行一下看下效果:
第一步:初始化package.json文件:
在工程根目录下的CMD中输入npm init,然后会生成package.json文件
⚠️:这里name不能使用大写,如上动图所示,填写完相应的信息后会在根目录中生成相应的package.json文件,里面内容如下:
第二步:在package.json文件中添加启动脚本:
"start": "node node_modules/react-native/local-cli/cli.js start"
第三步:添加react和react-native 模块:
在根目录执行如下代码:
npm install --save react react-native
效果如图:
执行完成后会出现下图的node_modules
查看项目中有node_modules,说明react和react native 安装完成,如果没有说明安装失败,需要重新安装。
第四步:添加index.android.js文件到项目中:
⚠️:AppRegistry.registerComponent(‘ReactNativeApp’, () => ReactNativeApp);
里面的名称 必须和你的工程名一致,对这个文件不熟悉的童鞋可以看本人之前的代码或者
react-native官网
http://reactnative.cn/
下图是官网相关介绍:
第五步:添加ReactNative相关依赖:
1.在app的build.gradle文件中添加react-native依赖库
compile "com.facebook.react:react-native:+"
2.在project的build.gradle文件中添加react-native路径
maven { // All of React Native (JS, Obj-C sources, // Android binaries) is installed from npm url "$rootDir/../node_modules/react-native/android"}
⚠️:这里注意不要使用maven中的,因为我们使用的是我们本地的node_modules
第六步:添加相关权限:
在AndroidManifest.xml中添加如下代码:
<uses-permission android:name="android.permission.INTERNET" />
第七步:添加reactnative组件:
添加com.facebook.react.ReactRootView 组件 布局代码如下
java代码如下:
第八步:添加DevSettingsActivity配置
将DevSettingsActivity配置加入到AndroidManifest.xml文件中
第九步:实现ReactApplication
我们需要自定义Application然后去实现ReactApplication接口中的方法。
到此,我们已经大功告成,下面来看下效果。
效果展示:
如果你有想学习的文章直接留言,我会整理征稿。如果你有好的文章想和大家分享欢迎投稿,直接向我投递文章链接即可。
欢迎长按下图->识别图中二维码或者扫一扫关注我的公众号:
赞赏
长按二维码向我转账
受苹果公司新规定影响,微信 iOS 版的赞赏功能被关闭,可通过二维码转账支持公众号。
微信扫一扫
关注该公众号
- 现有Android项目引入ReactNative
- 现有Android项目引入ReactNative--九步大法
- 现有Android项目引入ReactNative--九步大法
- 现有Android项目引入ReactNative--九步大法
- 在Windows上将ReactNative集成到现有的Android项目
- ReactNative 移植Android项目
- ReactNative手动嵌入现有iOS项目(第N篇)
- android原生项目整合ReactNative
- 第三方库 zlib库 引入到现有项目中
- Kotlin 引入Android项目
- cocoapods 把reactNative 集成到现有项目中Podfile文件内容
- django引入现有数据库
- django引入现有数据库
- Android 项目中嵌入 ReactNative 模块
- Android 项目中嵌入 ReactNative 模块
- ReactNative打包Android项目APK包
- ReactNative For Android 项目实战总结
- ReactNative重构之前的android项目
- 安装lnmp并配置可允许远程连接mysql
- 数独求解java
- [python爬虫] 正则表达式使用技巧及爬取个人博客实例
- C++字节对齐
- 设计一个动物声音模拟器,希望可以模仿许多动物的叫声
- 现有Android项目引入ReactNative
- Connecting to https://XXXXXXXXXXXXXXXXXXXXXXXX:8440/ca
- 配置:win7+opencv 3.0.0+vs 2013
- Android8.0全面了解ShortcutManager,并创建应用快捷方式(适用于8.0及8.0以下系统)
- 【scala 笔记(8)】 特质 -- trait
- Python知识点
- 原型模式和管理器
- ETCD 简介 + 使用
- Tian Ji -- The Horse Racing HDU