ReactNative开源项目推荐 - iReading (运行)

iReading

是一个新闻阅读App,Android和iOS双适配。并且作者还在持续的更新。目前1100+star。

传送门: https://github.com/attentiveness/reading,可自行查看项目介绍,线上版本地址,运行说明

集成步骤

参考文档:开源地址的MD,权限问题可试一下sudo,

npm很慢的话可以换国内源:

临时指定:$npm install -gd express --registry=http://registry.npm.taobao.org

修改配置:$npm config set registry http://registry.npm.taobao.org

  1. clone项目下来,cd 项目目录

  2. $(sudo) npm install -g react-native-cli(如果已经配置好了可跳过)

  3. $(sudo)npm install

  4. $react-native start(此为手动启动服务,AndroidStudio和Xcode运行项目会自动启动,一般可跳过)

  5. Android版本运行调试:$react-native run-android (第一次比较久,下载配置和依赖,这里使用AndroidStudio直接打开Android项目,而且因为等Android打开太久,是先运行了iOS)

    1. 修改Android项目目录下的gradle版本配置为自己的版本,加载完依赖如下

    2. (Build and Run)▶︎,自动启动服务

    3. 模拟器运行,(加载错误,可尝试reload),启动页面

    4. 进入主界面,报一个警告⚠️,后续处理

  6. iOS版本运行调试($react-native run-ios):

    1. xcode打开项目中的ios文件夹下 reading.xcodeproj

    2. 修改一下bundle Identifier,证书Signing

    3. (Build and Run)▶︎,自动启动服务

    4. 真机安装测试,刚开始如全屏红色报错,可尝试reload,看到的启动界面

就可以开始消化了,附上一些其他同样优秀的ReactNative开源项目,运行方法类似,(大部分来自江清清)

相关文章

导入moment 使用方式 年月日,时分秒 星期几 相对时间 7天后 2小时后 明天 将毫秒转换成年月日
@ 一、前言 为什么介绍redux-actions呢? 第一次见到主要是接手公司原有的项目,发现有之前的大佬在处理...
十大React Hook库 原文地址:https://dev.to/bornfightcompany/top-10-react-hook-libraries-4065 原文...
React生命周期 React的生命周期从广义上分为挂载、渲染、卸载三个阶段,在React的整个生命周期中提供很...
React虚拟DOM的理解 Virtual DOM是一棵以JavaScript对象作为基础的树,每一个节点可以将其称为VNode,用...
React中JSX的理解 JSX是快速生成react元素的一种语法,实际是React.createElement(component, props, ....