搭建開發(fā)環(huán)境
ReactNative中文官網(wǎng)-搭建開發(fā)環(huán)境
包括Homebrew，Node，Xcode等環(huán)境配置
開發(fā)工具
Sublime Text 3
安裝Package Control
Package Control是Sublime Text管理插件的工具，安裝后可以用Install Package搜索安裝插件（有時(shí)進(jìn)行Install Package會(huì)失敗，好像是墻的原因）
開發(fā)ReactNative的幾個(gè)插件
把SublimeText配置成ReactNative的IDE
- Babel
javascript(ES6)及jsx的代碼高亮 - Terminal
在sublime中打開終端并定位到當(dāng)前目錄，神器，mac下的快捷鍵為：command+shift+T - SublimeCodeIntel
這個(gè)插件屬于代碼提示類的插件,有了它才能夠提示項(xiàng)目內(nèi)的提示,方法引用,變量提示,還有引用跳轉(zhuǎn). - All Autocomplete
Sublime的自動(dòng)補(bǔ)全只能讀取當(dāng)前文件中的關(guān)鍵字, 有了這個(gè)這個(gè)插件就可以補(bǔ)全其他已打開的文件的關(guān)鍵字. - AutoFileName
自動(dòng)補(bǔ)全文件路徑,并且會(huì)提示圖片文件的尺寸
語法檢查 Eslint
如何配置Eslint檢測(cè)React代碼
教程之前確保已經(jīng)安裝node.jd和npm了，可以用npm -v和node -v看是否已經(jīng)安裝。
- Sublime Text 3安裝sublimeLiter,sublimeLiter-contrib-eslint
- npm相關(guān)安裝，linter，eslint，eslint-plugin-react，babel-eslint
步驟
ps：需要終端cd到項(xiàng)目根目錄中運(yùn)行
安裝linter
$ npm install linter
安裝eslint
$ npm install eslint -g（加g為全局安裝）
安裝eslint-plugin-react(不用加-g)
識(shí)別react中的一些語法檢驗(yàn)
$ npm install eslint-plugin-react
安裝eslint-plugin-react-native
npm install eslint-plugin-react-native
安裝babel-eslint
如果用到了es6的新語法, 需要安裝babel-eslint,不然會(huì)把箭頭函數(shù)識(shí)別成 錯(cuò)誤
$ npm install babel-eslint
在項(xiàng)目的根目錄創(chuàng)建配置文件.eslintrc.json
參考如何配置Eslint檢測(cè)React代碼
在項(xiàng)目根目錄執(zhí)行eslint --init ，將會(huì)生成.eslintrc.js的配置文件
eslint
eslint-plugin-react代碼檢查規(guī)則
eslint代碼檢查規(guī)則，中文的
eslint-plugin-react-native
下圖是安裝linter的時(shí)候的錯(cuò)誤，網(wǎng)上一查是python的一個(gè)文件沒有訪問權(quán)限，執(zhí)行sudo chown -R $USER /Library/Python/2.7即可，問題出處
