我使用的Sublime插件及配置

增强型插件

Package Control

快捷键ctrl+~,调出命令行,运行:

import urllib.request,os,hashlib; h = '2915d1851351e5ee549c20394736b442' + '8bc59f460fa1548d1514676163dafc88'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

Terminal

方便地调出CMD。

  • 快捷键Ctrl+Shift+T

  • 在Windows下默认会打开Windows PowerShell, 可配置为原生CMD:

    配置:preference–>Package Settings–>Terminal–>Terminal Settings-users

{
"terminal": "C:\\WINDOWS\\system32\\cmd.exe",
//"terminal": "C:\\Program Files\\cmder\\Cmder.exe",
"parameters": ["/START", "%CWD%"]
}

Sidebar Enhancements

增强侧边栏。

AdvancedNewFile

快速新建文件。

  • 可以指定目录,若目录不存在,也会新建该目录。

  • 使用:Ctrl+Alt+N,输入文件夹以及文件名,回车,子目录下的文件新建完成。

Browser Refresh

保存文件自动刷新浏览器。

配置:Preferences > Package Settings > Browser Refresh > Key Bindings – Users

{
"keys": ["ctrl+s"], "command": "browser_refresh", "args": {
"auto_save": true,
"delay": 0.0,
"activate": true,
"browsers" : ["chrome"]
}
}

Sublime功能型插件

SublimeREPL

解释器。

  • SublimeREPL 可以直接在编辑器中运行一个解释器,支持很多语言:

    Clojure, CoffeeScript, F#, Groovy, Haskell, Lua, MozRepl, NodeJS, Python, R, Ruby, Scala, shell

  • Tools->sublimeREPL->Python->选择相应模块

  • 定制快捷键:preference->Key Bindings-User

[
{
"keys":["f5"],
"caption": "SublimeREPL: Python - RUN current file",
"command": "run_existing_window_command", "args":
{"id": "repl_python_run","file": "config/Python/Main.sublime-menu"}
},
{
"keys": ["f6"],
"caption": "SublimeREPL: Python - IPython",
"command": "run_existing_window_command","args":
{"id": "repl_python_ipython","file":"config/python/Main.sublime-menu"}
}
]
  • 使用:F5:运行当前文件 F6:调出ipython命令行

SublimeCodeIntel

代码提示插件。

  • 点击 Preferences->Browse Packages->SublimeCodeIntel

  • 添加一个.codeintel文件夹(Windows创建.codeintel文件夹需要输入.codeintel.

  • 在文件夹里面添加一个config文件:

  {
"PHP": {
"php": '/usr/bin/php',
"phpExtraPaths": [],
"phpConfigFile": 'php.ini'
},
"JavaScript": {
"javascriptExtraPaths": []
},
"Perl": {
"perl": "/usr/bin/perl",
"perlExtraPaths": []
},
"Ruby": {
"ruby": "/usr/bin/ruby",
"rubyExtraPaths": []
},
"Python": {
"python": '/usr/bin/python',
"pythonExtraPaths": []
},
"Python3": {
"python": '/usr/bin/python3',
"pythonExtraPaths": []
}
}

SublimeLinter

行内语法检测插件。

支持: C/C++, Java, Python, PHP, JS, HTML, CSS, etc.

版本控制

Git

  • 快捷键Ctrl+Shift+P,输入Git命令,在下拉框中选择即可。

  • 特别的,输入git diff,还可以比较文件差异。

GitGutter

在gutter区域显示一个标记,标记任何你在代码中做的编辑,添加或删除。

SVN

  • 快捷键Ctrl+Shift+P,输入Git命令,在下拉框中选择即可

  • 或者在相应文件上右键,选择SVN命令

  • 或者在侧边栏的文件、文件夹上右键,选择SVN命令

Modific

标记代码的改变,支持git和svn。

除了高亮变化,还可以通过按Ctrl + Alt + D来查看或比较当前的代码与最近提交的代码之间的区别。

颜色、匹配

ColorPicker

取色器改变颜色。

  • 使用方法: Ctrl + Shift + C,快捷键有冲突,需修改。

  • 可以通过Ctrl+Shift+P:搜索Colorpicker调用。

Color Highlighter

检测CSS文件中的颜色码,不论是Hex码或者RGB码都能很好的显示。

  • Color Highlighter能够设置成用背景色或者边框提示颜色,

  • 配置:preference->Package Setting->Color Highlighter->Settings User

{
"enabled": true,
"ha_style": "filled",
"icons": false
}
  • Color Highlighter有自带的Color Picker。在CSS文件中选中颜色,右键菜单中选择Choose Color

Gutter Color

在gutter显示css文件的颜色。需依赖imagemagick,没配置成功。

BracketHighlighter

在gutter上显示与鼠标位置匹配的括号、引号、HTML标签

自动补全

AutoFileName

文件路径自动提示。

AllAutocomplete

搜索全部打开的标签页。

Doc Blockr

生成优美的注释。

简单用法:输入/**并且按下Tab键的时候,会自动解析任何一个函数并且为你准备好合适的模板。

HTML与标记语言

Emmt

代码快速补全。

  • 有一套Emmt语法,可以快速创建HTML标签。

  • 按下Tab键,Emmet就能把一个缩写展开成一个HTML和CSS代码块。

HTML-CSS-JS Prettify

HTML-CSS-JavaScript 代码格式化。

这个代码格式化插件可以代替很多其他格式化插件,如TAG,CssComb和JSFormat。

IconFont

字体图标补全。

  • 为许多流行的图标字体提供了snippet(代码片段),比如 FontAwesome, PaymentFont,Typicons 和 Github Octicons。

  • 它的工作原理类似于常规的HTML代码段,每个图标的缩写将扩展成完整的class和HTML代码。

Bootstrap 3 Snippetes / bs3

Bootstrap 3 代码片段

  • 配置:Preferences->Settings-User:

"auto_complete_triggers": [{"selector": "text.html", "characters": "<"},{"selector": "text.html", "characters": "bs3"}]
  • 使用:代码片段触发字符为bs3

MarkDown Editing

Markdonw最好的插件了:语法高亮,缩略词,自动补全,配色方案。

MarkDown Preview

以用浏览器浏览 Sublime Text 中编写的 markdown文件。

  • 配置浏览器路径:* Preferences->Package Settings->Markdown Preview->Setting User*

{
"browser" : "C:\\Users\\gymmer\\AppData\\Local\\Google\\Chrome\\Application\\chrome.exe"
}
  • 设置快捷键:Preferences->Key Binding User

{
"keys": ["f3"], "command": "markdown_preview", "args": {"target": "browser", "parser":"markdown"}
}
  • 使用:在Markdown文件页面按下快捷键

CSS

AutoPrefixer

CSS文件中浏览器私有属性前缀补全 。

  • 需依赖Node.js。

  • 使用:在输入CSS3属性后(冒号前)按Tab

  • 配置:Preferences>package setting>AutoPrefixer>Setting-User

{
"browsers": ["last 7 versions"],
"cascade": true,
"remove": true
}

或者

{
"browsers": ["last 2 versions","last 2 Chrome versions",">5%","Firefox >= 20","ie 6-8","iOS 7"]
}
  • 快捷键绑定:Preferences>Key Bindings-User

[
{ "keys": ["ctrl+alt+shift+p"], "command": "autoprefixer" }
]

CSScomb

CSS属性排序。

使用:选中要排序的CSS代码,右键菜单选择Run CSScomb

Goto CSS Declaration

快速跳转到CSS定义位置。

  • 选中HTML文件中的class或id名,右键菜单选择Go To CSS Declaration

  • 注意对应的css文件要同时打开才行。

Inc Dec Value

调整数字、日期、十六进制颜色。

  • 将光标放在数字的右边,然后按Alt +↑增加或Alt +↓减少。也可以使用鼠标滚轮。

  • 允许你同时增加或减少数字,即使他们在不同的行。

Less

Less语法高亮

Less2css

自动编译less文件为CSS文件

  • 需依赖Node.js环境

  • npm install -g less

  • npm install -g less-plugin-clean-css

  • npm install -g less-plugin-autoprefix

JavaScript

jQuery

jQuery的API代码片段。

JavaScript Completions

JS最基本的API快查片段。

Nodejs

node代码提示。

Minify

HTML、CSS、JS压缩

  • 需依赖Node.js环境

  • npm install -g clean-css uglifycss js-beautify html-minifier uglify-js minjson svgo

  • 使用:在相应文件上右键,选择Minify。会自动生成一个同名的.min文件

Python

Anaconda

配置:preference->Package Setting->Acaconda->Settings User

[
{"python_interpreter": "C/Python27/python.exe"}
]

Djaneiro

Django插件。

Python PEP8 Autoformat

代码格式更正。

快捷键ctrl+shift+R

Python点操作符智能提示

复制Python.sublime-package文件,到C:/Program Files/Sublime Text 3/Packages/

中文与编码

ChineseLocalization

Sublime中文汉化包。

ConvertToUTF8

GBK编码兼容。文件转码成utf-8.

  • 可以编辑并保存目前编码不被 Sublime Text 支持的文件。

  • 使用:安装插件后自动转换为utf-8格式。

IMESupport

输入中文时,候选词跟随鼠标.

GBK Encoding Support

中文识别

  • Sublime Text可识别UTF-8格式的中文,不识别GBK和ANSI,因此打开很多含中文的文档都会出现乱码。

  • 通过安装插件GBK Support,来识别GBK和ANSI。

有用的配置

添加到右键菜单

修改sublime text3 注册右键菜单.reg,将路径换为sublime_text.exe所在路径。注意,路径中是双斜杠\

验证License

配置:打开Help -> Enter License,粘贴下列代码:

—– BEGIN LICENSE —–
Michael Barnes
Single User License
EA7E-821385
8A353C41 872A0D5C DF9B2950 AFF6F667
C458EA6D 8EA3C286 98D1D650 131A97AB
AA919AEC EF20E143 B361B1E7 4C8B7F04
B085E65E 2F5F5360 8489D422 FB8FC1AA
93F6323C FD7F7544 3F39C318 D95E6480
FCCC7561 8A4A1741 68FA4223 ADCEDE07
200C25BE DBBC4855 C4CFB774 C5EC138C
0FEC1CEF D9DCECEC D3A5DAD1 01316C36
—— END LICENSE ——

安装主题Brogrammer

  • 下载压缩包,解压缩

  • 重命名为Theme - Brogrammer

  • 打开Sublime包目录:Preferences -> Browse Packages

  • Theme - Brogrammer复制到包目录下

  • 配置:Preferences -> Settings - User

{
"theme": "Brogrammer.sublime-theme",
"color_scheme": "Packages/Theme - Brogrammer/brogrammer.tmTheme"
}

用浏览器快速打开页面

需先安装Sidebar Enhancements.

-设置快捷键:Preferences->Key Bindings - User

//chorme
{
"keys": ["f1"],
"command": "side_bar_files_open_with",
"args": {
"paths": [],
"application": "C:\\Users\\gymmer\\AppData\\Local\\Google\\Chrome\\Application\\chrome.exe",
"extensions": ".*"
}
},
//IE
{
"keys": ["f2"],
"command": "side_bar_files_open_with",
"args": {
"paths": [],
"application": "C:\\Program Files\\Internet Explorer\\iexplore.exe",
"extensions": ".*"
}
}

其中:

  • keys是按键。

  • application是浏览器应用程序路径,注意反斜杠的要转义。

  • extensions是匹配所有的文件后缀格式。

  • 直接按下快捷键即可

关闭自动更新

  • 配置:Preferences -> Settings-User

  • 加入这条语句:"update_check":false

  • 关闭Submine Text并重启,即不会再弹出更新提醒了

其他没用过的

Alignment:代码对齐

TrailingSpacer:高亮显示多余的空格和Tab

JavaScriptNext:ES6语法识别

YUI Compressor:压缩JS和CSS文件

Pretty JSON:格式化出漂亮的json

我使用的Sublime插件及配置的更多相关文章

  1. git备份sublime插件及配置

    github备份sublime配置 sublime使用的时间长了,渐渐的就积累了一些有用甚至离不开的插件.但是有时候系统会出点问题,或者换电脑什么的,这时候要想在找回那个曾经的sublime就不那么容 ...

  2. Sublime 3 如何配置SVN插件

    在sublime里面安装svn的插件,就可以在sublime的操作界面里面进行相关svn操作,这样就不用再回到文件系统中,进行相关svn的操作. 1.在进入sublime界面后,点击顶部菜单“Pref ...

  3. Sublime 插件安装、常用配置

    安装:sublime + 插件 安装Sublime: 官网:http://www.sublimetext.com/ 安装package control组件,之后我们会使用该组件给Sublime安装常用 ...

  4. sublime插件emmet的配置、使用及快捷键Ctrl+E修改成Tab键操作

    一.emmet在sublime中的配置与使用: 1.点击sublime text 3的图标,打开编辑器: 2.按键“ctrl+shift+p”,或者单击菜单->工具->命令面板: 3.打开 ...

  5. sublime 插件cssrem安装及配置

    CSSREM CSSREM 是一个CSS的 px 值转 rem 值的Sublime Text3自动完成插件.先来看看插件的效果: 一个CSS的px值转rem值的Sublime Text 3自动完成插件 ...

  6. sublime常用插件及配置

      以下是我的sublime插件列表: Side​Bar​Enhancements增强版侧边栏 这个插件官方不支持通过package安装了,只能手动了,下载地址https://github.com/S ...

  7. Sublime 插件- px 转rem

    一个CSS的px值转rem值的Sublime Text 3自动完成插件. 插件效果如下: 安装 克隆项目   https://github.com/hyb628/cssrem.git 进入packag ...

  8. Sublime Text 3 配置和使用方法

    下载: Sublime Text 3 官方下载地址 Sublime Text 3 汉化破解版 资料: Sublime Text 非官方文档   技巧 -用户或-User后缀的菜单项,其对应的配置文件都 ...

  9. Sublime插件支持Sass编译和Babel解析ES6 & .sublime-build文件初探

    用Sublime Text蛮久了,配置配来配去的,每次换电脑都得重头再配过,奈何人老了脑子不中用了,得好好整理一些,下次换电脑就有得参考了.. 同事说,他的WebStorm简直太方便,自身集成了很多方 ...

随机推荐

  1. 13 KNN背景分割器

    传统的前景背景分割方法有GrabCut,分水岭算法,当然也包括一些阈值分割的算法.但是这些算法在应用中往往显得鲁棒性较弱,达不到一个好的分割效果. 现代的背景分割算法融入了机器学习的一些方法来提高分类 ...

  2. 洛谷P1451 求细胞数量

    求细胞数量 题目链接 这道题大概是一个最简单的联通块的题了qwq 注意枚举起点的时候 一定不要从0开始不然你就会从0进入到了其他联通块中从而多查. 一定看清题意这道题不是同色为联通块!!! AC代码如 ...

  3. HTML标准开头

    <!doctype html> <html>   <head> <meta charset="utf-8"> <title&g ...

  4. react基本知识点合集

    妹子UI里面有React的相关组件与用法:http://amazeui.org/react/components React官方网站:https://facebook.github.io/react/ ...

  5. 《Cracking the Coding Interview》——第1章:数组和字符串——题目6

    2014-03-18 01:45 题目:给定一个NxN的矩阵,就地旋转90度.(没有样例又不说方向的话,随便往哪儿转.) 解法:如果N为奇数,除了中心点以外四等分.如果N为偶数,四等分.按照A-> ...

  6. Webdriver--获得验证信息

    title:获得当前页面的标题 current_url:获得当前页面的URL text:前面提到过,获得标签对的文本信息 try: couseTitle = driver.find_element_b ...

  7. Python 3基础教程13-写入文件

    前面介绍了函数,这篇我们就利用Python 内构函数open来写入字符串到txt文件里. 直接看demo.py 这里有一个小问题,如果我要输入时中文到txt文件会报unicode错误,暂时没法解决.

  8. springboot整合jersey

    https://blog.csdn.net/xiongpei00/article/details/76576420

  9. 分享6个网址二维码API接口

    1.http://pan.baidu.com/share/qrcode?w=150&h=150&url=http://www.54admin.net 2.http://b.bshare ...

  10. myEclipse如何将程序部署到tomcat(附录MyEclipse调试快捷键)

    部署 1.选中你要部署的项目,在工具栏找到 Deploy MyEclipse J2EE Project to Server 2.单击Add,即出现如下界面.选择相应的Server,要和你在配置tomc ...