我是 atom 深度用戶(1000+小時使用者),這個答案是試着想把 atom 玩6的前端開發者的福音,滿滿乾貨
原文在我博客裏面(博客裏支持 md 渲染,看我博客也要記得點贊,收藏也要點贊)我是寫了一個系列的 atom tips
http://simplyy.space/tag/56ecd7303aae9e5a65c46d63
其中包括
我這裏把 web 開發經常使用插件 貼到這裏,
# atom tips(2):web 開發經常使用插件
## 使用 package 的步驟
0. search it in setting pane install option
1. read readme(important,雖然大部分插件看名字就知道用途,但 readme 會寫更詳細的用途,同樣的東西,不一樣人用的效果能夠很是不一樣)
2. think whether you need it, if yes install it
3. set its setting (if it has setting,think how you want use it,很是重要,這步就是根據你的需求定製你的插件)
4. run it(or test it feature)
## 提示
講真,atom 的 packages 很是很是的棒,下載、使用、發佈都很是簡單,不管是用別人的 amazing 的 package,仍是本身動手弄一個 useful package,都很方便。
不過,**工具的意義在於使用,而不是在於炫技**,我這裏寫的是我日常用到的第三方插件,不一樣的人羣固然有不一樣的需求,個人插件 osx 下都很表現不錯,win 下不能保證,我也是不斷試錯、思考、更新,才獲得如今的插件列表,每個插件我都用過不止10次,有的插件甚至天天都用10次(好比我本身寫的那個,逃),因此你們也應該選取對本身本身經常使用的,本身用得好纔是真的好。
並且即使使用成本低,可是也只有用心去用才能用的好,用的優雅。
## packages
### markdown
> atom 如今已經成爲個人最佳 markdown 編輯器,有了下面的插件後,使用體驗,簡直太棒了。
- markdown-preview-plus@2.2.2
- markdown-assistant@0.1.0(Upload images from the clipboard automatically, win10 下失敗,osx 完美成功,粘貼圖片直接轉成 md 文本,不要太棒,優雅的沒朋友)
- qiniu-uploader@0.0.3
- markdown-writer@2.3.2(在設置裏面設置一下,就擁有了正常 md 編輯器的編輯 md 的各類快捷鍵 例如 cmd + b, cmd + shift + k 插入連接,並且更棒很是值得一試)
- markdown-toc@0.4.1
### autocomplete
- atom-ternjs@0.13.2(js 最佳補全插件)
- simplyy-snippets@0.4.4(我寫的 web 前端代碼補全插件,詳情見
GitHub - SimplyY/simplyy-snippets: atom package for code complete)
- css-snippets@0.9.0
- autocomplete-html-entities@0.1.0
- tag@0.3.0
- autocomplete-modules@1.4.1
### indent
- guess-indent@0.1.0
- resize-indent@0.2.1
### code hint and linter
- linter@1.11.3
- jshint@1.8.3
- jsonlint@1.1.2
- csslint@1.1.4
- htmlhint@1.1.3
### ui
- activate-power-mode@0.4.1(雖然很炫酷,可是我不用)
- file-icons@1.6.18(讓你擁有高顏值的文件圖標)
- pigments 代碼顏色可視化
- foldername-tabs@0.1.11
- highlight-column@0.5.1
- highlight-selected@0.11.2
- indent-guide-improved@1.4.5
- minimap@4.21.0
- fold-comments@0.6.0
- fold-functions@0.4.3
### git project
- merge-conflicts@1.3.7(amazing ,不再怕 git 的合併衝突了,分分鐘解決 conflicts)
- git-projects@1.17.0
### language
- language-SCSS@0.4.0
- language-vue@0.9.0
- react@0.14.1
### other tools
- atom-beautify@0.28.26(格式化代碼)
- line-count@0.5.0
- change-case@0.6.0(將代碼文本更改風格,好比 testCode => TEST_CODE)
- todo-show@1.4.0
- open-html-in-browser@0.1.0
- pretty-json@0.4.1
### Tree-view
- tree-view-copy-relative-path@1.0.0
- copy-filename@1.0.1
- tree-view-git-status@0.2.3
- chary-tree-view@0.2.3(Tree-view responds to only double-click to avoid opening a large file accidentally.)
### amazing useful
- terminal-plus(不推薦 win 用)
osx 下效果圖: