Mac环境下React Native开发App环境搭建

1. 搭建环境
   (1). 安装最新版的XCode(如果不是最新版,可能在之后新建项目的时候,会编译通不过)

   (2). 安装HomeBlew(OS系统上的一个安装包管理器,安装后可以方便后续安装包的安装。)
		终端命令:
		ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

   (3). 安装Node.js (服务端的JavaScript运行环境)
		下载地址:https://nodejs.org/download/
		成功安装后,终端会有如下提示信息:
		Node.js was installed at: /usr/local/bin/node 

		npm was installed at: /usr/local/bin/npm 

		Make sure that /usr/local/bin is in your $PATH.

   (4). 建议安装WatchMan(React修改source文件的一个工具)
		终端命令: 
		brew install watchman

   (5). 安装Flow: 一个JavaScript 的静态类型检查器。
		终端命令:
		brew install flow

   (6). 安装React Native CLI: 用来开发React Native的命令行工具
		终端命令:
		npm install -g react-native
		装好了环境,就可以愉快的玩耍起来了。
 
2. 创建项目
  (1). 新建一个“HelloWorld”的项目,终端输入命令行:react-native init HelloWorld
        创建成功后显示如下log:

        This will walk you through creating a new React Native project in /Users/yaoliangjun/Documents/ReactNative/HelloWorld
		Installing react-native package from npm...
		Setting up new React Native app in /Users/yaoliangjun/Documents/ReactNative/HelloWorld
		react@15.1.0 node_modules/react
		├── object-assign@4.1.0
		├── loose-envify@1.2.0 (js-tokens@1.0.3)
		└── fbjs@0.8.3 (immutable@3.8.1, ua-parser-js@0.7.10, promise@7.1.1, isomorphic-fetch@2.2.1, core-js@1.2.6)
		To run your app on iOS:
		   cd /Users/yaoliangjun/Documents/ReactNative/HelloWorld
		   react-native run-ios
		   - or -
		   Open /Users/yaoliangjun/Documents/ReactNative/HelloWorld/ios/HelloWorld.xcodeproj in Xcode
		   Hit the Run button
		To run your app on Android:
		   Have an Android emulator running (quickest way to get started), or a device connected
		   cd /Users/yaoliangjun/Documents/ReactNative/HelloWorld
		   react-native run-android

	(2). 用XCode打开项目,编译运行即可。	

 3. React-Native服务在编写过程中要一直开着,如果不小心把它关了,可以在终端输入:npm start 来重新开启服务。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值