我常用的sublime插件

  • A+
所属分类:开发者工具
摘要

用过一些IDE,如eclipse、intelliJ,这些IDE是很智能,插件也不少,但个个都不是省油的灯————内存杀手。更受不了的是10G内存eclipse占了2G+之后还是卡。
不再做全栈开发之后开始使用轻量级的编辑器,用过的编辑器有Emacs(ctrl到死实在用不惯)、Vim(比较好用,但是速度上以及插件方便程度不如sublime)、ultraedit(据说是黑客必备编辑器,插件太少)、atom(github版的sublime,一直很看好,可惜速度慢我不能接受)、sublime(速度快,插件丰富,还支持vim操作)。最终选择了受众多人追捧的sublime。
本人平常开发主要语言是javascript(jquery、angular)、html、css(bootstrap),用到一些工具如gurnt、less、git、svn。除了命令行(其实sublime也有个terminal插件,不过窗口太丑,功能也不强大,所以不如直接win+r来得快),基本上都在sublime这个“IDE”上操作。主要用到了以下插件(Windows系统):

一、代码校验、提示、优化

Alignment

美化对其”=”、”:”这些符号。

BracketHighlight

代码块括号高亮工具,可以自定义括号颜色。可以打开和折叠代码块。

DocBlockr

在函数上一行输入 /** 然后回车,神奇的事情发生了,jsdoc就生成了。如果你遵循的编码的风格很严格,这款插件能够使你的任务更容易。DocBlokr 帮助你创造你的代码注释,通过解析功能,参数,变量,并且自动添加基本项目。

参阅:Sublime Text3 插件:DocBlockr与javascript注释规范

Emmet

以前叫zencoding,快速编写html的一个插件, 前端开发必备神器 。按下Tab键,Emmet就能把一个缩写展开成一个HTML和CSS代码块,他支持的编辑器远远不止sublime这一种.

参阅 :http://emmet.io/

http://docs.emmet.io/cheat-sheet/

HTML-CSS-JS Prettify

html、css、js文件一键优化,快捷键Ctrl+shift+H

此插件需要安装node.js环境

JsFormat

很不错的格式化js文件和json文件的插件,快捷键 Ctrl+Alt+F

格式化HTML文本里的js代码时,需要选中js代码,再格式化。

Tag

HTML/XML格式化,选中一段html,按Ctrl+Alt+F即可。

CodeFormatter

可以配置格式化多种语言代码:PHP,js/json,html,css,Python

AngularJS

编写Angular时给出智能提示

JavaScript Completions

javascript 脚本补全插件.类似的插件还有AndyJS2 ,但是已经很久没有更新了

JQuery

JQueryAPI的智能提示

SublimeCodeIntel

个插件支持以下语言的自动提示功能:JavaScript, Mason, XBL, XUL, RHTML, SCSS, Python, HTML, Ruby, Python3, XML, Sass, XSLT, Django, HTML5, Perl, CSS, Twig, Less, Smarty, Node.js, Tcl, TemplateToolkit, PHP.但我个人用着感觉不是很习惯。

CSScomb

CSS代码风格格式化.

FixMyJS
Jsfmt
JsFormat

JS/JSON代码风格格式化.

Minifier

手动版js文件压缩工具。

WebInspector

在 JavaScript调试方面,这是一个令人惊讶的工具,Sublime上的完整的代码检查工具。
功能:使用绝对路径储存在用户设置中的项目断点,控制台,分步和断点调试器,栈追踪。这些都能够很棒的工作!而且Mozilla还提供了一个插件Fireplay让你连接到Firefox 开发工具和最简单的调试器JSHint

SublimeLinter

行内语法检测插件,支持: C/C++, Java, Python, PHP, JS, HTML, CSS, etc.

SublimeLinter-jshint

和SublimeLinter配合使用,支持js语法规则校验,每个js编写者必备。

 All Autocomplete

Sublime Text 默认的 Autocomplete 功能只考虑当前的文件,而 AllAutocomplete 插件会搜索所有打开的文件来寻找匹配的提示词。

ColorPicker

通常,如果你想使用一个颜色选择器则可能打开 Photoshop 或 GIMP。而在 Sublime Text 中,你可以使用内置的颜色选择器。安装完成后,只要按下Ctrl / Cmd + Shift + C 快捷键。

 SublimeREPL

这可能是对程序员最有用的插件。SublimeREPL 可以直接在编辑器中运行一个解释器,SublimeREPL 允许你在 Sublime Text 中运行各种语言(NodeJS , Python,Ruby, Scala 和 Haskell 等等)。

REM PX

把px单位换算成rem单位,在写移动端样式的时候有用。

insert callback

nodejs中的insert callback插件方便设置回调函数,快捷键是alt+c

二、文件保存预览

FTPSycn
SFTP

两款常用的FTP/SFTP管理工具。

AutoFileName

自动补全文件路径-非常方便。

Local History

非常推荐,智能缓存编辑过的文件,有点像本地版本管理工具。

Markdown Preview
MarkdownEditing

markdown 的好搭档,用来显示预览md格式文件的效果。虽然许多开发人员更喜欢在云端(GitHub Gists,StackEdit,Markable)创建 Markdown 文件 。不过另外一些喜欢在本地编写 Markdown 文件的开发者, MarkdownPreview 很有用,可以预览文件,还有颜色高亮显示。

HTTP Requester

如果做基于REST的API,那么这个就太有用了。基本用法:选中url,ctrl+alt+R

三、版本控制

SVN

插件功能很像小乌龟TortoiseSVN,在侧边栏上右键操作即可。

Git

在工作中,版本控制软件最常用的软件之一,而最流行的 VCS 是 Git。你是否厌倦了保存文本文件,并切换回终端运行一些 Git 命令。如果你能从文本编辑器本身执行 Git 命令,岂不是很好?右键可视化操作,同上。

GitGutter

Sublime Text 有了 Git 插件之后,GitGutter 更好的帮助开发者查看文件之前的改动和差异,提升开发效率。

四、sublime自身优化

Soda

Soda主题

Dracula Color Scheme

黑白灰,一个极简主题,适合低调的开发者。

AdvancedNewFile

可以直接用快捷键 ctrl+alt+n 在sublime的控制台创建文件(夹)

Seti_UI

给文件加上一个小图标

SidebarEnhancements

增强侧边栏

 

五、自动化工具

Grunt

IDE都有一个神奇的功能,只要保存代码,就会自动编译发布,这一点可以利用Grunt的watch插件来实现。sublime的Grunt插件只是方便调用项目中已经配置的Gruntfile.js中的任务。用 ctrl+p 输入 grunt 即可使用,智能方便。

目前听说的自动化工具有3种:Grunt、Fis、Gulp。

Grunt是比较成熟的自动化管理工具,有丰富的插件,将代码自动化分解成一个一个的任务来执行。
Fis百度出的自动化工具,应该比较符合国人习惯,如果偷懒可以考虑使用。

Gulp比较推荐,类似node.js的流处理效率较高,插件也蛮丰富,据资料显示目前人气最高的自动化工具。

Base Encoder

base64编码与解码

HTTP Requester

查看get post请求状态

Figlet字符图形转换工具

http://www.figlet.org

sublime里安装Figlet Big ASCII Text 插件

六、最后补充

改为vim模式

vim是一个脱离鼠标操作的古老编辑器,vim的操作方式意味着通过模式的切换来执行光标定位、移动、剪切等操作,大大提高编写速度。很高兴的是sublime可以配置成一个”伪vim”。

在菜单栏上依次点击Preferences ——> setting-user

把“ignored_packages”: [“Vintage”] 修改为 "ignored_packages": []

七、更多

sublime能够如此之火的原因在于插件非常丰富,在packagecontrol上查看top100的插件逐个筛查也是一种高效的查找方式。
https://packagecontrol.io/browse/popular

PS:以上插件都可以通过Package Control这个功能强大的插件管理工具进行安装,非常方便。

 

参考资料:

http://net.tutsplus.com/articles/news/perfect-workflow-in-sublime-text-free-course/

 

最后更新于2017-05-04

weinxin
我的微信公众号
我的微信公众号扫一扫

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: