我是 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 下效果图: