Atom使用插件精選(FE)

Foreword

Atom琳琅滿目的插件中，不少插件參差不齊，根據個人實踐狀況，爲前端coder推薦一些實用的插件。

1. sync-settings

首先，這是一個配置備份插件，方便之後的遷移，配合gist實用快捷。

2. atom-beautify

使你的代碼一鍵格式化，支持多種語言，相對較全。

3. autoclose-html

html代碼自動化閉合，更加便捷的寫div.

4. autocomplete-paths

更加智能的補全你的資源路徑。

5. autoprefixer

爲CSS和SCSS增長瀏覽器前綴。

6. color-picker

在編輯器選擇你想要的顏色，找到顏色，點擊就OK.

7. docblockr

輔助編寫你的註釋，讓你愛上寫註釋。

8. elastic-tabstops

彈性製表符，適用於對於tab有強迫症的coder。

9. emmet

前端神器多年，前端必備，配合快捷鍵更個性化。

10. file-icons

指定文件擴展名的圖標和顏色，改善視覺。

11. git-control

提供了一個GUI界面來管理全部經常使用的git命令。（若是你不喜歡命令行）

12. gulp-control

顯示gulp任務的列表,在atom裏實現GUI執行。

13. highlight-selected

雙擊時高亮當前選擇的詞。

14. jquery-snippets

支持jquery代碼編寫。

15. language-vue

高亮顯示Vue代碼,支持Vue組件。

16. linter-csslint

檢測你的CSS是否基本規範，減小你的錯誤，提升代碼質量。

17. linter-eslint

看你上面的，我想你也瞭解這個是幹嗎的了。

18. linter-sass-lint

若是你使用SASS/SCSS，這個檢測是必要的。

19. minimap

一個完整源代碼的預覽，讓你看到代碼地圖。（不建議在一個文件裏寫很長的代碼）

20. minimap-highlight-selected

在你代碼概覽地圖上高亮顯示你的選擇。

21. open-in-browsers

你想在哪一個瀏覽器裏運行你的代碼，安裝這個吧。

22. regex-railroad-diagram

若是你常常要寫正則表達式，這個插件能夠顯示光標下的正則表達式鐵路圖。

23. simplified-chinese-menu

Atom 的簡體中文語言包，完整漢化，兼容全部已發佈版本 Atom。

24. tree-view-git-status

樹形文件視圖中顯示Git存儲庫狀態。

25. prettier-atom

An atom package for the prettier formatter.

Tips:

1. 以前找了好久atom的自動保存插件，沒找到，原來騎驢找驢，在自帶的核心擴展裏面就有。autosave，把裏面的配置settings裏的"Enabled"勾選中，就能夠在當前編輯頁面失去焦點的時候自動保存。

2. 在編輯器的核心包裏有line-ending-selector能夠定義你的換行類型。

3. 這個連接是個人配置gist： GitHubGist（包含上面全部的插件，還有我本身的配置，能夠直接導入擴展）

4. 若是你想更改atom-beautify裏的換行符，LF or CRLF ，see:

• Retrieves the default line ending based upon the Atom configuration

• line-ending-selector.defaultLineEnding. If the Atom configuration

• indicates "OS Default", the process.platform is queried, returning

• CRLF for Windows systems and LF for all other systems.

• Code modified from atom/line-ending-selector

• returns: The correct line-ending character sequence based upon the Atom

• configuration, or null if the Atom line ending configuration was not

• recognized.

• see: line-ending

• 在下面的路徑下修改你想要的：

• packages\atom-beautify\src\beautifiers\js-beautify.coffee

  getDefaultLineEnding= ->
  switch atom.config.get('line-ending-selector.defaultLineEnding')
    when 'LF'
      return '\n'
    when 'CRLF'
      return '\r\n'
    when 'OS Default'
      return if process.platform is 'win32' then '\r\n' else '\n'
    else
      return null
  複製代碼