React Native开源项目如何运行(附一波开源项目)
学习任何技术,最快捷的方法就是学习完基础语法,然后模仿开源项目进行学习,React Native也不例外。React Native推出了1年多了, 开源项目太多了,我们以其中一个举例子.给大家演示下如何运行开源项目.(前提是你已经搭建好React Native环境了)
下载开源项目
首先需要找到开源项目 ,比如下面这个. 地址: https://github.com/Bob1993/react-native-gank
进入github, clone到本地或者直接download到本地。 按照之前运行自己项目的经验,我们会直接在控制台进入项目目录,然后输入 react-native run-ios
或者react-native run-android
这时候发现并没有react-native 指令. 原因是这样的, 大部分开源项目并不是完整的项目, 缺少了项目的依赖, 就像我们运行java没有jdk环境一样。
下面是一个完整的项目:
而开源项目为了减少空间,并没有提交node_mudules目录,需要我们自己安装
npm安装node_modules
node_modules 是整个项目的依赖, 里面包含什么呢? 包含的文件全部都写在package.json
文件中了。 这个文件是必不可少的。我们需要按照这个列表下载。
这时候需要给大家简单介绍下,因为react native项目是通过nodejs构建的,所以在nodejs项目中都需要package.json
文件。具体大家可以看看nodejs相关知识 。 七天学会 Nodejs
安装node_modules 非常简单, 进入项目目录执行命令 npm install
会自动按照package.json
下载对应的依赖。 但是问题来了, 经常会出现下面的错误:
大部分都是由于网速的问题导致的,有些依赖甚至需要翻墙才能下载。最好的办法就是把npm的下载源改成国内的镜像,修改方法有三种,如下:
1.通过config命令 npm config set registry https://registry.npm.taobao.org npm info underscore (如果上面配置正确这个命令会有字符串response)
2.命令行指定 npm --registry https://registry.npm.taobao.org info underscore
3.编辑~/.npmrc 加入下面内容 registry = https://registry.npm.taobao.org
修改完了,再执行npm install
下载完成就会有如下的提示:
剩下的就是运行项目了。
开源项目汇总
https://github.com/liuhongjun719/react-native-DaidaiHelperNew 借贷助手 https://github.com/liuhongjun719/react-native-BabyHealth- 仿宝宝健康 https://github.com/nihgwu/react-native-sudoku 数独 https://github.com/attentiveness/reading reading https://github.com/CoderGLM/ReactNativeLeaning github.com/eesc88/prog… 云翻译客户端 https://github.com/jiangqqlmj/GaGaMall 嘎嘎商城 github.com/879479119/B… 仿B站客户端 github.com/Shuijwan/ma…漫威电影客户端 github.com/talentjiang…公司移动OA办公客户端 github.com/yohnz/maoya…仿猫眼电影客户端 github.com/soliury/nod…CNode论坛客户端 github.com/Kennytian/L…仿拉勾网客户端 github.com/SFantasy/We…iOS新浪微博客户端 github.com/kailuo99/to…iOS资讯头条APP github.com/xiekw2010/r…Github客户端 github.com/iSimar/Hack…Hacker新闻客户端 github.com/starzhy/The…码农客户端 github.com/tabalt/Reac…新闻客户端 github.com/vczero/Reac…豆瓣搜索客户端 github.com/race604/Zhi…知乎日报客户端
更多精彩请关注微信公众账号likeDev
React Native开源项目如何运行(附一波开源项目)相关推荐
- 79个!工信部2020工业互联网试点示范项目名单(附14个热点项目揭秘)
日前,工信部对外公示了<2020年工业互联网试点示范项目名单>,其中包含有五大类79个试点示范项目. 其中网络化改造集成创新应用类4个.标识解析集成创新应用类11个."5G+工业 ...
- 使用Intellij Idea创建第一个SpringBoot+MyBatis+MySql项目并运行(附安装教程),使用Maven构建项目并管理第三方jar
Intellij Idea 背景 开发工具及主要框架 Maven 下载安装 settings.xml修改 IDEA配置Maven 注册私有jar Maven打包 MySql安装 配置环境变量 Inte ...
- github上的html项目怎么运行,GitHub搭建简单的项目“Hello HTML”
2.注册GitHub账号. 3.登陆GitHub.点击"Sign in"进入登陆界面,输入账号密码登录GitHub. 4.进入GitHub后创建存储库(New repository ...
- React Native 开源项目汇总
最近闲来无事,学习了React Native开发Android APP,自我感觉RN APP的效果和Native APP比还是蛮不错,以下是找到的一些优秀源码,仅供学习参考... React Nati ...
- React Native开发之IDE(Atom+Nuclide)安装,运行,调试
版权声明:本文为博主原创文章,如需转载请注明出处 目录(?)[-] 前言 MacWindowsLinux 准备工作 安装Atom 安装Nuclide 新建一个工程 自动补全 类型标注 语法检查 跳转到 ...
- React Native —— App
使用 React Native 作为 app 框架,Redux 作为数据层,因此我们需要选用一些支持性的技术和工具: 开源的 Parse Server 做数据存储 - 运行在 Node.js 上. F ...
- React Native发布重构路线图
React Native作为时下最热门的跨平台开发方案,在这两年的移动跨平台方案中可谓一枝独秀,在很多的移动产品中都可以看到它们的影子,相比国内的Weex,RN的迭代更加频繁,性能上也无限的接近原生应 ...
- Facebook 正式公开 React Native 重构细节!
[CSDN编者按]Facebook 2013 年开发的 React Native 是著名的跨平台移动应用开发工具之一.目前,它不仅是最为活跃的开发者社区之一,还是 GitHub 上贡献者数量最多的开源 ...
- React Native初探
React Native初探 转自:博客园 叶小钗 前言 很久之前就想研究React Native了,但是一直没有落地的机会,我一直认为一个技术要有落地的场景才有研究的意义,刚好最近迎来了新的APP ...
最新文章
- 添加或者更新字段说明
- Excel中 提取字符串中的字符或数字
- word-break属性和css换行显示
- 三目运算符_C语言知识点:运算符的优先级和结合性
- 邮件服务器两种协议,邮件服务器协议
- 操作数组的常用方式二-----排序、查找
- wifi两种工作模式
- Buffer、ArrayBuffer、DataView互转(node.js)
- 第二章 变量和基本类型
- Codeforces 1029B. Creating the Contest 动态规划O(nlogn)解法 及 单调队列O(n)解法
- 如何将数据库文件进行压缩
- 【VMware vSAN 7.0】4.8 有关 vSAN 许可证的注意事项—我们有软硬件解决方案
- 电商数据分析与数据化运营
- FMCW 雷达基本原理
- mac DOSBox快捷键
- 聚合支付的清算风险有哪些?
- 狂妄之人怎么用计算机弹,天谕手游狂妄之人乐谱代码分享
- ANSYS附加动水质量(westergarrd公式)
- SQL语句-各种查询
- 本地打印机获取以及文件打印 java