React Native開發之ATOM開發實用技巧

前面對React Native開發工具Atom做了一個詳細的介紹,詳見RN開發IDE詳解
Atom作爲一款前端開發利器,有很多的插件供我們選擇,這裏羅列常見的可以提高我們開發效率的插件給大家介紹一下。

ATOM常用插件

1、simplified-chinese-menu

Atom的簡體中文語言包,完整漢化,兼容所有已發佈的版本Atom。

2、tree-view-finder

左邊菜單欄顯示方式,類似Mac OS下的finder。
這裏寫圖片描述

3、minimap

類似sublim text右邊的代碼縮略圖。

4、linter和linter-jshint

該插件是用jshint來檢查代碼,想必大家都聽說過jshint代碼檢查工具,它有一個配置文件.jshintrc,這個文件告訴jshint執行的檢查規則。通過jshint能發現代碼中存在的問題,可以及時避免bug的發生。linter-jshint插件基於atom規則來使用jshint,該插件可以在項目根目錄下新建一個.jshintrc來告訴檢查規則,也可以不用創建此文件來進行代碼檢查。
注意:linter-jshint是依賴linter插件來使用的,也就是說必須先安裝linter插件;因爲linter是一個粗糙的檢查,有很多針對專門項的代碼檢查,如linter-csslint、linter-php等等
這裏寫圖片描述

5、linter-js-standard

用來使javascript代碼格式化。

6、git-plus

提供git版本控制操作的命令,個人感覺不是很好用,還是terminal比較習慣。

7、file-types和file-types-icon

file-types用來區分文件類型的,file-types-icon用來給不同的問題類型添加不同的圖標。
這裏寫圖片描述

8、emmet

這款插件是用來支持zend-coding,Emmet的前身是大名鼎鼎的Zen coding,如果你從事Web前端開發的話,對該插件一定不會陌生。它使用仿CSS選擇器的語法來生成代碼,大大提高了HTML/CSS代碼編寫的速度。

9、autoclose-html

html標籤自動比較。

10、atom-ternjs

該插件能對一個對象中擁有的對外提供的屬性和方法都能通過suggest的形式提示出來,能對一個對象對外提供的接口有一個選擇過程,可以理解爲js代碼自動提示。

11、atom-html-preview

html頁面預覽。

12、atom-bootstrap3

bootstrap3代碼提示插件。

13、Remote-FTP

ftp管理工具,命令和圖形化界面都支持。
這裏寫圖片描述

14、autocomplete-paths

文件路徑自動提示,相當的犀利。
這裏寫圖片描述

15、atom-beautify

代碼格式化,可以定製化風格。

16、autoprefixer

瀏覽器兼容。

這裏寫圖片描述

17、color-picker

顏色取值器,也是相當的不錯。
這裏寫圖片描述

ATOM快捷鍵大全

文件切換

ctrl-shift-s保存所有打開的文件
cmd-shift-o 打開目錄
cmd- 顯示或隱藏目錄樹
ctrl-0焦點移到目錄樹,目錄樹下,使用a,m,delete來增加,修改和刪除
cmd-t或cmd-p 查找文件
cmd-b在打開的文件之間切換
cmd-shift-b 只搜索從上次git commit後修改或者新增的文件

導航

ctrl-p 前一行
ctrl-n 後一行
ctrl-f 前一個字符
ctrl-b 後一個字符
alt-B, alt-left 移動到單詞開始
alt-F, alt-right 移動到單詞末尾
cmd-right, ctrl-E 移動到一行結束
cmd-left, ctrl-A 移動到一行開始
cmd-up 移動到文件開始
cmd-down移動到文件結束
ctrl-g移動到指定行 row:column 處
cmd-r 在方法之間跳轉

目錄樹操作

cmd-,cmd-k ,cmd-b 顯示(隱藏)目錄樹
ctrl-0 焦點切換到目錄樹(再按一次或者Esc退出目錄樹)
a 添加文件
d將當前文件另存爲(duplicate)
i顯示(隱藏)版本控制忽略的文件
alt-right 和 alt-left展開(隱藏)所有目錄
ctrl-al-] 和 ctrl-al-[ 展開(隱藏)所有目錄
ctrl-[ 和 ctrl-] 展開(隱藏)所有目錄
cmd-k h 或者 cmd-k left 在左半視圖中打開文件
cmd-k j或者cmd-k down在下半視圖中打開文件
ctrl-shift-C複製當前文件絕對路徑

編輯和刪除文本

基本操作

ctrl-T使光標前後字符交換
cmd-J將下一行與當前行合併
ctrl-cmd-up, ctrl-cmd-down使當前行向上或者向下移動
cmd-shift-D複製當前行到下一行
cmd-K, cmd-U使當前字符大寫
cmd-K, cmd-L使當前字符小寫

刪除和剪切

ctrl-shift-K刪除當前行
cmd-backspace刪除到當前行開始
cmd-fn-backspace刪除到當前行結束
ctrl-K剪切到當前行結束
alt-backspace 或 alt-H刪除到當前單詞開始
alt-delete 或 alt-D刪除到當前單詞結束

查找和替換

cmd-shift-f在整個工程中查找
cmd-F在buffer中查找
alt-shift-S查看當前可用代碼片段

摺疊

alt-cmd-[摺疊
alt-cmd-] 展開
alt-cmd-shift-{ 摺疊全部
alt-cmd-shift-}{ 展開全部
cmd-k cmd-N { 指定摺疊層級 N爲層級數

自動補全

ctrl-space提示補全信息

git操作

cmd-alt-Z checkout HEAD 版本
cmd-shift-B 彈出untracked 和 modified文件列表
alt-g down, alt-g up在修改處跳轉
alt-G O在github上打開文件
alt-G H在github上打開文件history
alt-G C拷貝當前文件在gihub上的網址