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
下载对应的依赖。
但是问题来了, 经常会出现下面的错误:

大部分都是由于网速的问题导致的,有些依赖甚至需要FQ才能下载。最好的办法就是把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
下载完成就会有如下的提示:

剩下的就是运行项目了。
React Native开源项目如何运行(转载)的更多相关文章
- React Native开源项目如何运行(附一波开源项目)
学习任何技术,最快捷的方法就是学习完基础语法,然后模仿开源项目进行学习,React Native也不例外.React Native推出了1年多了, 开源项目太多了,我们以其中一个举例子.给大家演示下如 ...
- React Native开源项目案例
(六).React Native开源项目: 1.Pober Wong_17童鞋为gank.io做的纯React Native项目,开源地址:https://github.com/Bob1993/Rea ...
- React Native 开源项目汇总
最近闲来无事,学习了React Native开发Android APP,自我感觉RN APP的效果和Native APP比还是蛮不错,以下是找到的一些优秀源码,仅供学习参考... React Nati ...
- 什么是 Native、Web App、Hybrid、React Native 和 Weex?(转载)
什么是 Native.Web App.Hybrid.React Native 和 Weex? 来源:zwwill_木羽 segmentfault.com/a/1190000011154120 一句 ...
- React Native(ios)项目中logo,启动屏设置
由于logo和启动屏尺寸多,react native(ios)中没有命令可以自动生成各种的尺寸,所以可以使用以下办法:在ionic项目中生成(使用命令:ionic resources)后,再粘贴到re ...
- React Native 之 项目实战(一)
前言 本文有配套视频,可以酌情观看. 文中内容因各人理解不同,可能会有所偏差,欢迎朋友们联系我. 文中所有内容仅供学习交流之用,不可用于商业用途,如因此引起的相关法律法规责任,与我无关. 如文中内容对 ...
- 配置React Native环境及解决运行异常
一. 安装Homebrew: Homebrew的官网(多语言版本)简单明了地介绍了如何安装和使用这个工具,;并提供了自己的Wiki. brew的安装很简单,使用一条ruby命令即可,Mac系统上已经默 ...
- React Native初始化项目后执行react-native run-ios,构建失败
今天是肿么了......一上班创建React Native项目,react-native run-ios运行就报错,运行不了...呜呜...... 一开始以为自己react-native run-io ...
- Android开源项目分类汇总-转载
太长了,还是转载吧...今天在看博客的时候,无意中发现了@Trinea在GitHub上的一个项目Android开源项目分类汇总,由于类容太多了,我没有一个个完整地看完,但是里面介绍的开源项目都非常有参 ...
随机推荐
- Atitit 提升进度的大原则与方法 高层方法 attilax总结
Atitit 提升进度的大原则与方法 高层方法 attilax总结 生产力的提升点 1.1. 管理,管理的发展发展非常缓慢,1 1.2. 方法论(前后分离,dsl等)1 1.3. 工具( 工具链 ...
- Selenium和firefox兼容性问题
Selenium和firefox兼容性问题 2016-07-10 若出现兼容性问题,会报如下错误: org.openqa.selenium.firefox.NotConnectedException: ...
- 给dubbo接口添加白名单——dubbo Filter的使用
本文转自:http://blog.csdn.net/mj158518/article/details/47379799 在开发中,有时候需要限制访问的权限,白名单就是一种方法.对于Java Web应用 ...
- ubuntu下使用golang、qml与ubuntu sdk开发桌面应用 (简单示例)
找了很长时间go的gui库,试了gtk,准备试qt的时候发现了这个qml库,试了下很好用. ##准备工作 **1.Go 1.2RC1** go的版本应该不能低于这个,我是在1.2RC发布当天升级后发现 ...
- 采用镜像的方法安装python第三方库
转自:https://blog.csdn.net/s740556472/article/details/68557330 pip install --index https://pypi.mirror ...
- OpenGL——折线图柱状图饼图绘制
折线图绘制代码: #include<iostream> //旧版本 固定管线 #include<Windows.h> #include <GL/glut.h> // ...
- Linux Platform驱动模型(一) _设备信息
我在Linux字符设备驱动框架一文中简单介绍了Linux字符设备编程模型,在那个模型中,只要应用程序open()了相应的设备文件,就可以使用ioctl通过驱动程序来控制我们的硬件,这种模型直观,但是从 ...
- C/C++判断传入的UTC时间是否在今天
在项目中经常会显示一个时间,如果这个时间在今日内就显示为时分秒,否则显示为年月日. 这里先给出一个正确的版本: #include <iostream> #include <time. ...
- 十、K3 WISE 开发插件《SQL Profiler跟踪单据操作时产生的SQL语句》
=================================== 目录: 1.查询帐套的数据库DBID 2.配置需要跟踪数据库的DBID 3.配置跟踪参数 4.跟踪进行 5.分析跟踪语句 === ...
- Kafka创建Topic时如何将分区放置到不同的Broker中
熟悉 Kafka的同学肯定知道,每个主题有多个分区,每个分区会存在多个副本,本文今天要讨论的是这些副本是怎么样放置在 Kafka集群的 Broker 中的. 大家可能在网上看过这方面的知识,网上对这方 ...