搭建开发环境

ReactNative中文官网-搭建开发环境
包括Homebrew，Node，Xcode等环境配置

开发工具

Sublime Text 3

安装Package Control
Package Control是Sublime Text管理插件的工具，安装后可以用Install Package搜索安装插件（有时进行Install Package会失败，好像是墙的原因）

开发ReactNative的几个插件

把SublimeText配置成ReactNative的IDE

Paste_Image.png

• Babel javascript(ES6)及jsx的代码高亮
• Terminal 在sublime中打开终端并定位到当前目录，神器，mac下的快捷键为：command+shift+T
• SublimeCodeIntel
  这个插件属于代码提示类的插件,有了它才能够提示项目内的提示,方法引用,变量提示,还有引用跳转.
• All Autocomplete
  Sublime的自动补全只能读取当前文件中的关键字, 有了这个这个插件就可以补全其他已打开的文件的关键字.
• AutoFileName
  自动补全文件路径,并且会提示图片文件的尺寸

语法检查 Eslint

如何配置Eslint检测React代码
教程之前确保已经安装node.jd和npm了，可以用npm -v和node -v看是否已经安装。

• Sublime Text 3安装sublimeLiter,sublimeLiter-contrib-eslint
• npm相关安装，linter，eslint，eslint-plugin-react，babel-eslint
  步骤
  ps：需要终端cd到项目根目录中运行

安装linter

$ npm install linter

安装eslint

$ npm install eslint -g（加g为全局安装）

安装eslint-plugin-react(不用加-g)

识别react中的一些语法检验
$ npm install eslint-plugin-react

安装eslint-plugin-react-native

npm install eslint-plugin-react-native

安装babel-eslint

如果用到了es6的新语法, 需要安装babel-eslint,不然会把箭头函数识别成 错误
$ npm install babel-eslint

在项目的根目录创建配置文件.eslintrc.json

参考如何配置Eslint检测React代码
在项目根目录执行eslint --init ，将会生成.eslintrc.js的配置文件
eslint
eslint-plugin-react代码检查规则
eslint代码检查规则，中文的
eslint-plugin-react-native

下图是安装linter的时候的错误，网上一查是python的一个文件没有访问权限，执行sudo chown -R $USER /Library/Python/2.7即可，问题出处