工欲善其事, 必先利其器.
ReactNative作為Facebook貢獻(xiàn)的庫, 里面有些定制的東西. 官方推薦Atom+Nuclide, 那么就嘗試一下Atom. 在測試過程中, 發(fā)現(xiàn)安裝Nuclide之后, Atom編輯器特別卡頓, 原因不明, 所以又測試了一些其他插件. 我來羅列幾個(gè)必須的.
1. Atom
下載Atom編輯器, 安裝, 介紹參考文檔.
2. Atom-React
插件Atom-React, 這個(gè)插件非常好!
點(diǎn)擊Atom->Install Shell Commands, 安裝Shell命令, 再輸入
apm install react
即可安裝, 也可以直接搜索安裝, Command+,, 選擇Install搜索.
- 語法高亮(Syntax Highlighting);
- 縮進(jìn)(Indentation), 搜索插件 ->
Auto Indent;
搜索插件
Command+Shift+P, 直接輸入Intent, 參考視頻.
- 代碼折疊(Code Folding);
- 片段提示(Snippets);
片段提示的縮寫需要符合文件后綴名
jsx, js等.
- JSX格式化(JSX Reformatting), 插件搜索
Reformat, 選擇Reformat JSX. - HTML到JSX轉(zhuǎn)換(HTML to JSX conversion), 轉(zhuǎn)換代碼樣式;
- 自動(dòng)補(bǔ)全(Autocomplete);
- 自動(dòng)閉合標(biāo)簽(Automatic Closing Tag);
3. 跳轉(zhuǎn)
跳轉(zhuǎn)對于調(diào)試代碼和閱讀代碼非常重要, 當(dāng)然使用插件, 需要下載hyperclick和js-hyperclick, 就可以通過引用跳轉(zhuǎn)到需要類和方法.
跳轉(zhuǎn)插件
4. 注釋插件
注釋對于寫和讀代碼都非常重要, 推薦插件docblockr, 搜索即可.
/**
* 滾動(dòng)條, fractionalPosition滾動(dòng)條長度, progressBarSize當(dāng)前大小
* @param {size:滾動(dòng)條大小} {progress:過程}
* @return {View} [里外兩層視圖, 背景白框黑底, 顯示白框]
*/
5. 類型顯示
atom-typescript類型顯示和其他強(qiáng)大的功能, 參考文檔.
6. 管理配置
安裝了很多包之后, 可以通過編輯器管理; 如果要恢復(fù)初始, 刪除.atom即可.
OK, 現(xiàn)在可以編寫ReactNative程序了, 如果發(fā)現(xiàn)其他插件, 我會(huì)繼續(xù)更新.
目前, 正在使用Pycharm開發(fā), 感覺也比較順手.
Enjoy it.
