您的位置:首页 > 移动开发

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

2016-06-08 15:45 666 查看
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 来重新开启服务。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: