配置ReactNative开发环境

450 阅读2分钟

一、环境需求

1、安装Homebrew

Homebrew是OS X的套件(包)管理器,用于安装Node.js和一些其他必须的工具软件。

安装方式:

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

2、安装npm 和 Node.js

brew install node

node安装成功后npm自动也就有了,直接下载安装Node.js,网址:https://nodejs.org/en/download/

下载后直接安装即可

3、安装WatchMan

WatchMan是由Facebook提供的监视文件系统变更的工具。安装此工具可以提高开发时的性能(packager可以快速捕捉文件的变化从而实现实时刷新)。

brew install watchman

4、安装Flow

flow是一个 JavaScript 的静态类型检查器。这一语法并不属于ES标准,只是Facebook自家的代码规范。所以新手可以直接跳过(即不需要安装这一工具,也不建议去费力学习flow相关语法)。

brew install flow

二、React Native安装

Yarn、React Native的命令行工具(react-native-cli)

**    **   Yarn是Facebook提供的替代npm的工具,可以加速node模块的下载。React Native的命令行工具用于执行创建、初始化、更新项目、运行打包服务(packager)等任务。

npm install -g yarn react-native-cli

三、管理React Native库的版本

1、查看本地的React Native的版本

命令行输入

react-native --version

命令行效果

查看本地的React Native的版本

2、更新本地的React Native的版本

命令行输入

npm update -g react-native-cli

3、查询react-native的npm包最新版本

PM的全称是Node Package Manager ,是一个NodeJS包管理和分发工具,已经成为了非官方的发布Node模块(包)的标准。 npm包地址 :

https://www.npmjs.com/package/react-native

命令行查询

npm info react-native

查询效果

终端中

也可以在项目中查看

项目中

4、升级或者降级npm包的版本

只要把上图终端中选择列出的一个版本号复制粘贴到对应位置替换即可,如降级到0.24.1

npm install --save react-native@0.24.1

WebStom设置React Native代码提示

下载xml插件,解压按下面提示放到对应位置

https://github.com/virtoolswebplayer/ReactNative-LiveTemplate

Mac下安装 提示:如果没有templets文件夹,你可以手动创建一个

webstorm11安装路径 将ReactNative.xml 复制到 ~/Library/Preferences/WebStorm11/templates

webstorm2016.2安装路径 将ReactNative.xml 复制到 ~/Library/Preferences/WebStorm2016.2/templates

webstorm2017.1安装路径 将ReactNative.xml 复制到 ~/Library/Preferences/WebStorm2017.1/templates

重启 WebStorm