您的位置:首页 > Web前端 > HTML

sublime 3及常用插件

2017-06-11 02:50 288 查看
1、了解Zen Coding: https://www.baidu.com/link?url=c9YyfvWOfn0EtUrhKlZQ26ANUOD_CSqjgqqsb3lq6LQ05oy2MQs4hWEYLVTlFgHhZKLmtMPTq1xsk6MyyKQKGYoxVE8pudSPKorJacGzTJy&wd=&eqid=ed8e37ab0006abb800000002593bf5c2 http://www.cnblogs.com/EnSnail/p/6294897.html
2、官方下载sumblime 3及安装Package Control,下载emmet插件 http://www.sublimetext.com/3 http://www.cnblogs.com/tinyphp/p/3217457.html
3、emmet常用缩写
官方地址:http://docs.emmet.io/cheat-sheet/
我导出了pdf版,需要的同学可以下载:
链接:http://pan.baidu.com/s/1eQ74eSM 密码:laz1
4、Alignment
功能:”=”号对齐
简介:变量定义太多,长短不一,可一键对齐
使用:默认快捷键Ctrl+Alt+A和QQ截屏冲突,可设置其他快捷键如:Ctrl+Shift+Alt+A;先选择要对齐的文本
5、SublimeCodeIntel
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 等所有语言,是 Sublime Text 自带代码提示功能基础上一个更好的扩展,自带代码提示功能只可提示系统代码,而SublimeCodeIntel则可以提示用户自定义代码。SublimeCodeIntel支持跳转到变量、函数定义的功能,另外还有自动补全的功能,十分方便。
6、FileDiffs
功能:强大的比较代码不同工具
简介:比较当前文件与选中的代码、剪切板中代码、另一文件、未保存文件之间的差别。可配置为显示差别在外部比较工具,精确到行。
使用:右键标签页,出现FileDiffs Menu或者Diff with Tab…选择对应文件比较即可
7、GBK Support
功能:中文识别
简介:Sublime Text 2可识别UTF-8格式的中文,不识别GBK和ANSI,因此打开很多含中文的文档都会出现乱码。可以通过安装插件GBK Support,来识别GBK和ANSI。
使用:
Open a GBK File
Save file with GBK encoding
Change file encoding from utf8 to GBK or GBK to utf8
8、加强侧边栏(SideBarEnhancements)
点击Open/Run选项。则只打开了该文件如图;若Open In Browser → 右侧任意一栏(点击),则在浏览器中预览
设置默认预览浏览器,文件(右键单击) → Open In Browser → Default(点击)时,会以默认的浏览器打开,如果我们想自己设置默认浏览器,我们应该进行如下配置:
①.菜单Sublime Text → Preferences → Package Settings → Side Bar → Settings User(点击),则打开了Side Bar.sublime-settings文件。
②.复制下面的代码,粘贴到Side Bar.sublime-settings中,并保存。
{
"default_browser": "firefox" //one of this list: firefox, aurora, chrome, canary, chromium, opera, safari
}
设置用快捷键进行快速预览,当我们需要快速预览网页时,需要进行如下配置。
①.菜单Sublime Text → Preferences → Key Bindings(点击),则打开了Defult(OSX).sublime-keymap — User文件。
②.复制下面的代码,粘贴到Defult(OSX).sublime-keymap — User的中括号中,并保存
9、版本管理git

10、view in browser

11、ConvertToUTF8

12、snippets和completions
http://blog.useasp.net/archive/2015/11/30/sublime-text-create-multiple-snippets-in-one-file.aspx
.sublime-completions
{
"scope": "source.python",
"completions":
[
{ "trigger": "doc", "contents": "'''\n${1:TODO DOC HERE}\n'''" }
]
}
.sublime-snippet
<snippet>
<content><![CDATA[
#!/usr/bin/env python
# -*- coding: utf-8 -*-
#
# Copyright @ ${1:2015} ${2:Mitchell Chu}
# Blog: http://blog.useasp.net/ 
]]></content>
<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
<tabTrigger>!python</tabTrigger>
<!-- Optional: Set a scope to limit where the snippet will trigger -->
<scope>source.python</scope>
</snippet>
13、autofilename
文件路径自动提示
14、Bracket Highlighter
功能:代码匹配简介:可匹配[], (), {}, “”, ”, <tag></tag>,高亮标记,便于查看起始和结束标记使用:点击对应代码即可15、Clipboard Manager
功能:粘贴板历史记录简介:方便使用复制/剪切的内容使用: - Ctrl+alt+v:显示历史记录 - Ctrl+alt+d:清空历史记录 - Ctrl+shift+v:粘贴上一条记录(最旧) - Ctrl+shift+alt+v:粘贴下一条记录(最新)
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  html coding zen