一、React-Native MacOS必备环境配置:

1.安装homebrew(这东西可以理解为命令行的app商店)

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

2.安装Node.js环境(解析JS所需的环境node+安装之后你就可以用npm命令了)

brew install node

3.安装 watchman (用来检测代码改变的工具)

brew install watchman

4.使用 `npm` 安装 React Native CLI 工具

npm install -g react-native-cli

5.上面一步如果【实在不行】把NPM的源改成淘宝

npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global  

好了,到此为止,基本环境已经全部搞定。

二、先跑个官方的初始化demo压压惊

1.在任意文件夹下运行(此工程已经直接帮你安装好依赖包了,所以直接跑就行)

react-native init MyFirstAppRN

2.直接打开运行iOS的工程即可,看到蓝色的奇奇怪怪的非常辣鸡的界面,说明运行成功了。

3.天坑提醒:在运行新的React-native工程时,切记把之前跑过的终端关掉!!!因为前一个Node服务器还在运行,这次运行肯定失败

我被这坑过无数,虽然无数教程本来就是他妈无法运行的,但这个init的工程我亲身尝试,确实是可以直接运行的。

4.改一行代码试试:

index.ios.js里定义了首页加载的姿势,比如可以把这里改掉:

class MyFirstRN extends Component {
render() {
return (
<View style={styles.container}>
<Text style={styles.welcome}>
这他妈就是 React Native?
</Text>
<Text style={styles.instructions}>
To get started, edit index.ios.js
</Text>
<Text style={styles.instructions}>
Press Cmd+R to reload,{'\n'}
Cmd+D or shake for dev menu
</Text>
</View>
);
}
}

此时并不需要关APP,直接按苹果键cmd+R刷新下就出现最新结果了。

至此,基本技能已经掌握。

如果到此还跑不起来,再看一遍,如果还是不行,建议不要再当程序员。

ReactNative 从环境和第一个demo说起,填坑教程的更多相关文章

  1. 搭建 AngularJS+Ionic+Cordova 开发环境并运行一个demo

    目前的手机APP有三类:原生APP,WebAPP,HybridApp:HybridApp结合了前两类APP各自的优点,越来越流行. Cordova就是一个中间件,让我们把WebAPP打包成Hybrid ...

  2. Mediapipe 在RK3399PRO上的初探(一)(编译、运行CPU和GPU Demo, RK OpenglES 填坑,编译bazel)

    PS:要转载请注明出处,本人版权所有. PS: 这个只是基于<我自己>的理解, 如果和你的原则及想法相冲突,请谅解,勿喷. 前置说明   本文作为本人csdn blog的主站的备份.(Bl ...

  3. Cocos2d-x 学习(1)—— 通过Cocos Studio创建第一个Demo

    近期在工作上有了比較大的转变,自学情绪也慢慢高涨,本来一直在研究unity的技术.由于换了工作会開始接触cocos2d-x.但并不意味着停止研究unity,以后有时间还是会继续的. 公司的cocos2 ...

  4. ArcGIS API for JavaScript开发环境搭建及第一个实例demo

    原文:ArcGIS API for JavaScript开发环境搭建及第一个实例demo ESRI公司截止到目前已经发布了最新的ArcGIS Server for JavaScript API v3. ...

  5. 下载,配置环境变量,第一个demo

    一.在 http://www.oracle.com 下载java JDK 安装到自定义的地方. 二.配置环境变量:在我的电脑→高级系统设置→环境变量 ① 找到Path新增一个路径(该路径为JDK存放的 ...

  6. lua入门之环境搭建、第一个demo

    前言 前段时间因为有些项目功能需要,自己研究了下lua,今天整理下,并以一个demo为示例演示 手机上的运行效果 分为几个步骤来逐步讲解. 1.lua介绍,为什么选择它? 2.环境安装 3.撸一个简单 ...

  7. react-native 搭建环境

    1.安装 nodejs 配置环境变量 node -v npm -v 2.安装 javaSE 1.8以上 http://www.oracle.com/technetwork/java/javase/ar ...

  8. (1)shiro简介和第一个demo

    之前一直在用shiro开发,不过只是会使用,并没有深入了解,最近有时间学习了一下,把最近学习所得分享一下. shiro简介 Apache Shiro是一个强大且易用的Java安全框架,执行身份验证.授 ...

  9. Angular2 不明真相第一个Demo例子

    如果不是去年换工作接触到AngularJS,估计是不会花时间去学习这个框架的,毕竟是前端的框架,不是自己熟悉的领域.但是为了混得下去,去年就学习了AngularJS的一些用法,当时还整理了一些积累 & ...

随机推荐

  1. MySQL慢查询Explain Plan分析

    Explain Plan 执行计划,包含了一个SELECT(后续版本支持UPDATE等语句)的执行 主要字段 id 编号,从1开始,执行的时候从大到小,相同编号从上到下依次执行. Select_typ ...

  2. phpAdmin安装

    phpAdmin是和Navicat重复的功能 负责管理MySql数据库 不过他是使用浏览器进行管理MySql数据库 PHP环境搭建的完整步骤 http://www.cnblogs.com/azhe-s ...

  3. 使用Sqoop从MySQL导入数据到Hive和HBase 及近期感悟

    使用Sqoop从MySQL导入数据到Hive和HBase 及近期感悟 Sqoop 大数据 Hive HBase ETL 使用Sqoop从MySQL导入数据到Hive和HBase 及近期感悟 基础环境 ...

  4. mysql配置以及性能优化(转)

    MySQL配置文件my.cnf中文详解,附mysql性能优化方法分享 ================================================================= ...

  5. 2016款MACBOOK PRO触控条版 安装WIN10初体验 及 无奈退货记

    新的2016MBP终于发布了,作为把苹果电脑装WIN使用的人,等候很久之后,终于可以行动了. 黄山松 (Tom Huang) 发表于博客园http://www.cnblogs.com/tomview/ ...

  6. Xcode 6、7 打包

    从 Xcode 6 开始,打包需要开发者帐号添加到授权帐号列表里. 现实情况是作为公司开发工作者,很少能获此殊荣. 解决之道: 用 Xcode 6/7 照常打包,生成 *.xcarchive 文件,然 ...

  7. 4412开发板学习笔记-NFS服务器的搭建

    转自iTOP-4412讨论群: http://www.topeetboard.com 先来介绍一下NFS: NFS 是Network File System的缩写,即网络文件系统.一种使用于分散式文件 ...

  8. 帆软报表FineReport2016年1月份产品更新一览

    .条件属性可使用页码参数插件 由于报表计算逻辑关系,条件属性中取不到页码公式.但是有些场景下又是需要在条件属性中取到页码的,比如标题只要偶数页显示,比如奇数页标题标红等等. 插件安装完成后,条件属性里 ...

  9. 洛谷P1782 旅行商的背包[多重背包]

    题目描述 小S坚信任何问题都可以在多项式时间内解决,于是他准备亲自去当一回旅行商.在出发之前,他购进了一些物品.这些物品共有n种,第i种体积为Vi,价值为Wi,共有Di件.他的背包体积是C.怎样装才能 ...

  10. Java面向对象编程 第一章 面向对象开发方法概述

    一.软件开发经历的生命周期: ①软件分析 ②软件设计 ③软件编码 ④ 软件测试 ⑤ 软件部署 ⑥软件维护 二.为了提高软件开发效率,降低软件开发成本,一个优良的软件系统应该具备以下特点: ① 可重用性 ...