Branckets 常用插件说明
上面对Branckets做了一个简单的介绍->Branckets新一代Web开发编码神器, 这里我们来说说广大的开发者为Branckets开发的强大插件, 有了它们Branckets, 简直如虎添翼, 分分钟把集成IDE秒成渣.
UTF8 Converter
这个什么好解释的咯, 就只是UTF8.
https://github.com/Armacryss/brackets-utf8-converter
Shizimily Multi-Encoding for Brackets
Brackets默认是不支持GBK编码的, 特别是在windows上GBK编码是文本的默认编码, 虽然自己知道可以更改编码, 但是如果要协同工作的话, 碰上了不同编码的情况还是很蛋痛的
https://github.com/Hiromi-Ayase/brackets-shizimily-multiencoding
Brackets Beautify
代码美化插件, 这个自然是必装的咯, 支持 HTML, CSS, 和 JavaScrip 三种文件的格式化.
使用方法:
- Edit > Beautify
- Windows/Linux: Ctrl-Alt-B
- Windows: Ctrl-Shift-L
- MacOSX: Cmd-Shift-L
https://github.com/brackets-beautify/brackets-beautify
Brackets Autoprefixer
使用CanIUse上的css3数据,自动补全css3前缀和浏览器兼容,不过可能有些新了。有一些旧版本的浏览器会被抛弃掉
https://github.com/mikaeljorhult/brackets-autoprefixer
Brackets Icons
顾名思义, 按照文件的扩展名, 给它安排相应的图标
https://github.com/ivogabe/Brackets-Icons
Brackets Document Toolbar(with tabs)
Tab栏, 说来也奇怪为什么官方版本不支持这个功能. 随便一提, 早期的版本也不支持代码折叠, 貌似是从1.5开始支持了. 由此推断以后或许会支持这个功能.
https://github.com/dnbard/brackets-documents-toolbar
brackets-quick-search
选择文本后高亮显示相同的文本, 和Brackets Document Toolbar(with tabs), 官方同样不支持这个功能
https://github.com/enturn/brackets-quick-search
BracketstoIX extension
对Brackets增加的一些扩展功能
https://github.com/apptoix/bracketstoix
brackets-minimap
你使用过Submit的话估计你一定会对编辑框右侧的那个代码地图印象会相当深吧, brackets当然也会支持这种功能咯, 只是不是官方支持的而已, 不过也没关系, 使用起来是一样一样的.
https://github.com/zorgzerg/brackets-minimap
Brackets Terminal
让你能太编码的过程很方便的调用控制台命令, 而不用切换到控制台, 简直爽有木有
https://github.com/artoale/brackets-terminal
brackets-sftp-upload
代码时时同步到线上服务器, 免去了启动ftp的时间, 很方便
https://github.com/bigeyex/brackets-sftp-upload
Markdown Preview
对于经常需要写Markdown的你来说, 是不是需要时不时的预览下呢, 那么有了这个插件, 你就不用再进行编译和切换到浏览器查看了, 直接在编辑器内完成一切操作, 超nice.
https://github.com/gruehle/MarkdownPreview
Extract for Brackets
Adobe 官方插件, 可以预览PSD,点击图层,然后输入css属性,看到没有,图层的样式自动跑出来啦,有木有有木有?!width、height、left、top、color、background-color、opacity应有尽有,还能测量两个元素之间的距离,再也不用到PS里手工测量和偷瞄CSS Hat的代码啦!如果是文字图层,还可以点击copy text,文字就到粘贴板上啦。如果是普通图层,填写background或img的时候,还会自动切图到你的文件夹耶!要不要这么霸气呀?!
(PS: 当然对于大陆用户来说相当然并卵的插件o(╯□╰)o, 不支持离线, 而且最大只支持15MB, 我就只能呵呵)
https://helpx.adobe.com/creative-cloud/help/extract-for-brackets.html
QuickDocsJS
快速查看javascript帮助文档
使用: CMD+K
https://github.com/Wikunia/brackets-QuickDocsJS
QuickDocsPHP
快速查看PHP帮助文档
使用: CMD+K
https://github.com/Wikunia/brackets-QuickDocsPHP
brackets-jshint
javascript代码提示, 方便第一时间发现你编码时不规范的地方
https://github.com/cfjedimaster/brackets-jshint
brackets-csslint
css代码提示, 方便第一时间发现你编码时不规范的地方
https://github.com/cfjedimaster/brackets-csslint
Brackets-Git
集成Git到你的Brackets中
Main panel of Brackets Git
History panel of Brackets Git
Details view for a specific commit
Commit dialog
https://github.com/zaggino/brackets-git
html-designer
一个掉渣天的功能, 虽然并不新鲜, 但是能把他集成到Brackets中还是得费很大功夫的, 必须致敬.
使用拖拽的方式进行html布局, 详情请看下面GitHub
https://github.com/swmitra/html-designer
FuncDocr
快速生成文档注释, 相当方便, 比Sublime的那个参见还多了一个选择类型的功能, 虽然有点然并卵, 但是还是相当赞的
支持 javascript and php
使用方法: /**
+ Enter
https://github.com/wikunia/brackets-funcdocr
Emmet plugin for Brackets editor
HTML, CSS 快速编辑插件, 想必大家都知道的, 这里就不过多阐述, 以后可能会单独另起篇幅来说明.
http://emmet.io/
https://github.com/emmetio/brackets-emmet
PHP-SmartHints
一个十分好用的PHP代码提示, 补全插件
https://github.com/Brackets-PHP/Brackets-PHP-SmartHints
Bootstrap Snippets for Brackets
快速生成Bootstrap代码, 详细使用方法查看下面GitHub地址
https://github.com/acbarbosa1964/acb-bootstrap-snippets