欢迎光临
我们一直在努力

atom编辑器插件推荐

atom是github出品的文本编辑器,为开发者又提供了一款易用、牛逼的文本编译器。

下面推荐一下本人所装的atom社区插件(以下有些插件的图片来自于参考文献的图片)

1、emmet

这款插件是用来支持zend-coding,Emmet的前身是大名鼎鼎的Zen coding,如果你从事Web前端开发的话,对该插件一定不会陌生。它使用仿CSS选择器的语法来生成代码,大大提高了HTML/CSS代码编写的速度

复制代码
type this:
ul.list>li.item\({val-\)$}*3

get this:
<ul class="list">
    <li class="item1">val-01</li>
    <li class="item2">val-02</li>
    <li class="item3">val-03</li>
</ul>

复制代码

2、linter-jshint

该插件是用jshint来检查代码,想必大家都听说过jshint代码检查工具,它有一个配置文件.jshintrc,这个文件告诉jshint执行的检查规则。通过jshint能发现代码中存在的问题,可以及时避免bug的发生。linter-jshint插件基于atom规则来使用jshint,该插件可以在项目根目录下新建一个.jshintrc来告诉检查规则,也可以不用创建此文件来进行代码检查。
注意:linter-jshint是依赖linter插件来使用的,也就是说必须先安装linter插件;因为linter是一个粗糙的检查,有很多针对专门项的代码检查,如linter-csslint、linter-php等等

3、highlight-selected

高亮当前所选文字,双击后全文这个词或者变量都会高亮哦

4、git-control

个人感觉atom对git的支持还是不及webstrom好用,不过有些插件还是能弥补这个问题。git-control就是其中的一个很好的插件,他能提供一个git gui来来完成git的版本管理,非常方便操作,个人感觉比git-plus插件好用,而不是一个命令打开一个面板;

5、highlight-line

顾名思义,该插件是对光标所在行以高亮显示,从而可以准确定位光标所在的行

6、docblockr

这个插件可以帮助你快速的生成注释,很多高级的编辑器都有这个功能,只是atom没有内置实现

7、simplified-chinese-menu

atom提供的都是英文版,若是英文不好的,可以使用简体中文插件来汉化atom编辑器

8、atom-beautify

其他编辑器都支持代码格式化,以便阅读。atom-beautify插件提供类似的功能用于美化代码,可以对html、css、js等文件进行格式美化。使用时需要先选中要美化的代码

9、atom-ternjs

该插件能对一个对象中拥有的对外提供的属性和方法都能通过suggest的形式提示出来,能对一个对象对外提供的接口有一个选择过程

10、pigments

pigments插件是在项目文件中,用于为dom元素设置样式时,可以显示对应的样式值对应的颜色展示,相当有用。

11、hyperclick和js-hyperclick

这两个插件配合,作用是跳转到变量声明或者定义的地方,非常有用!!!,mac下使用comman+click,windows下使用contrl+click来跳转

12、autocomplete-patatom编辑器社区插件推荐

atom是github出品的文本编辑器,为开发者又提供了一款易用、牛逼的文本编译器。在开始接触前端并从工作开始一直用webstrom来进行前端开发,开始使用时,被他各种强大神奇的功能给折服:支持zen-coding、文件可以跟指定的类型关联、版本管理、文件查找等等,到现在我还是觉得他对我的开发效率有很大的提升。但是他重了,依赖了大量的包。导致后面高版本对硬件的要求越来越高,一般的机子都能卡半天。看图说话:

分享到:更多 ()

评论 抢沙发

评论前必须登录!