代码编辑器或者文本编辑器,对于程序员来说,就像剑与战士一样,谁都想拥有一把可以随心驾驭且锋利无比的宝剑,而每一位程序员,同样会去追求最适合自己的强大、灵活的编辑器,相信你和我一样,都不会例外。
好吧,我不得不承认,Sublime Text 3是个好用得“胃疼”的编辑器……我用过的编辑器不少,真不少~ 但却没有哪款让我特别心仪的,直到我遇到了 Sublime Text 3 !如果说“神器”是我能给予一款软件最高的评价,那么我很乐意为它封上这么一个称号。它小巧绿色且速度非常快,跨平台支持Win/Mac/Linux,支持32与64位,支持各种流行编程语言的语法高亮、代码补全等,但它有着很多其他编辑器没有的超酷的特性,让它的好用达到了前所未有的程度……
而且它支持N多格式:
但是,这个编辑器,默认的设置还是有些欠缺,所以,让我们一起来看看怎样配置它吧!
1.下载和安装
下载,尽量别到“XX下载站”,“XX助手”等地方下载。打开 链接 下载安装程序。
在这里,因为条件所限,只演示 Windows 下的配置。
点击Windows(64位系统建议下载Windows 64bit),下载安装程序。
备注:安装时建议按默认安装地址安装。因为以下配置文件皆是根据默认地址所写,如果更改安装地址,配置文件可能无法正常运行。
安装好之后大概是这样纸的:
2.基本配置
首先,要下载插件以及皮肤,首先安装Package Control。
首先按 Ctrl+~
组合键,再粘贴如下代码:
import urllib.request,os,hashlib; h = 'eb2297e1a458f27d836c04bb0cbaf282' + 'd0e7a3098092775ccb37ca9d6b2e4b7d'; 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)
按回车,静候五秒钟,重启Sublime,你就可以以搜索方式安装插件了。
启用方式:
3.安装一个耐看的主题
最近 Flat UI 大行其道,恰好发现了这个 Flat 风格的 Sublime Text 2 主题 Flatland,非常漂亮,分享给 Soda 主题用腻了的童鞋们。
安装方法:
**
自动安装
**
通过 Package Control 安装
Flatland 主题已经被加入了 Package Control 的数据库中,推荐使用此方法进行安装。在安装了 Package Control 的情况下,通过 Package Control: Install Package
命令搜索 Theme - Flatland
,确认安装即可。
通过 Git 安装
如果你更喜欢用 git 来维护,也可以直接在 Packages 目录下运行:
git clone git://github.com/thinkpixellab/flatland.git "Theme - Flatland"
**
手动安装
**
下载 Flatland 主题。
解压缩后将整个文件夹改名为 Theme - Flatland
并按以下方法打开Package目录:
拷贝到 Sublime Text 3 的 Packages 目录中。
**
激活主题
**
无论使用哪种方法安装了 Flatland,都需要通过以下方式将主题激活:
修改 Preferences 文件,通过 Sublime Text 3 的菜单 Preferences > Settings - User
可打开用户配置文件,在其中添加(或修改原来的设置):
{
"theme": "Flatland Dark.sublime-theme",
"color_scheme": "Packages/Theme - Flatland/Flatland Dark.tmTheme"
}
效果如下:
4.插件配置
BracketHighlighter 高亮显示匹配的括号、引号和标签
BracketHighlighter这个插件能在左侧高亮显示匹配的括号、引号和标签,能匹配的 [] , () , {} , “” , ” , 等甚至是自定义的标签,当看到密密麻麻的代码分不清标签之间包容嵌套的关系时,这款插件就能很好地帮你理清楚代码结构,快速定位括号,引号和标签内的范围。
插件下载: https://github.com/facelessuser/BracketHighlighter/tree/BH2ST3
TrailingSpacer 高亮显示多余的空格和Tab
有时候在代码结尾打多了几个空格或Tab,一般不会察觉,TrailingSpacer这款插件能高亮显示多余的空格和Tab,并可以一键删除它们,有代码洁癖的朋友应该会喜欢这个插件。
插件下载: https://github.com/SublimeText/TrailingSpaces
注意,在github上下载的插件缺少了一个设置快捷键的文件,可以新建一个名字和后缀为Default (Windows).sublime-keymap的文件,添加以下代码,即可设置“删除多余空格”和“是否开启TrailingSpacer ”的快捷键了。
[
{ "keys": ["ctrl+alt+d"], "command": "delete_trailing_spaces" },
{ "keys": ["ctrl+alt+o"], "command": "toggle_trailing_spaces" }
]
Alignment 等号对齐
按Ctrl+Alt+A,可以是凌乱的代码以等号为准左右对其,适合有代码洁癖的朋友。
插件下载: https://github.com/kevinsperrine/sublime_alignment/tree/python3
Clipboard-history 粘贴板历史记录
有了这个插件,便可方便使用sublime text 3里的粘贴板历史记录内容,快捷键Ctrl+Shift+V可调出该历史记录面板,按方向键选择想要粘贴的历史记录。不过这是sublime text 2下的插件,Ctrl+Shift+D清除粘贴板历史记录好像不能生效,不过重启sublime也可清除粘贴板的历史记录。
插件下载: https://github.com/kemayo/sublime-text-2-clipboard-history
gbk4subl 支持GBK编码
sublime text一个遗憾是不支持中文GBK编码,在编辑一些GBK编码的文件时就会出现乱码,还好sublime text 2有很多可以支持GBK编码的插件,可惜大多在sublime text 3下都不能工作,在github找了下,还好还有gbk4subl这款能让sublime text 3支持GBK编码的插件。
插件下载: https://github.com/jeewood/gbk4subl
Tradsim 中文繁字体和简体字转换
Tradsim是一款能把中文的繁字体和简体字互相转换的插件,只支持UTF-8编码,虽然觉得有点鸡肋,但还是介绍出来给需要的朋友吧,安装插件,因为插件包里没快捷键文件,所以我们可以自定义一个,可以新建一个名字和后缀为Default (Windows).sublime-keymap的文件,添加以下代码,即可设置“转换为简体字”和“转换为繁字体 ”的快捷键了。注意:转换是文件里全局的中文。
[
{"keys": ["ctrl+alt+s"], "command": "tradsim_to_sim"},
{"keys": ["ctrl+alt+t"], "command": "tradsim_to_trad"}
]
SideBarEnhancements 侧边栏增强
SideBarEnhancements本是增强侧边栏的插件,这里将教大家如何用来做sublime text 3浏览器预览插件,并可自定义浏览器预览的快捷键。
安装此插件,点击工具栏Preferences > package setting > side bar > Key Building-User
,键入以下代码,这里设置按Ctrl+Shift+C复制文件路径,按F1~F5分别在firefox,chrome,IE,safari,opera浏览器预览效果,当然你也可以自己定义喜欢的快捷键,最后注意代码中的浏览器路径要以自己电脑里的文件路径为准。
[
{ "keys": ["ctrl+shift+c"], "command": "copy_path" },
//firefox
{ "keys": ["f1"], "command": "side_bar_files_open_with",
"args": {
"paths": [],
"application": "C:\\software\\Browser\\Mozilla Firefox\\firefox.exe",
"extensions":".*" //匹配任何文件类型
}
},
//chrome
{ "keys": ["f2"], "command": "side_bar_files_open_with",
"args": {
"paths": [],
"application": "C:\\Users\\Mr.DenGo\\AppData\\Local\\Google\\Chrome\\Application\\chrome.exe",
"extensions":".*"
}
},
//ie
{ "keys": ["f3"], "command": "side_bar_files_open_with",
"args": {
"paths": [],
"application": "C:\\Program Files\\Internet Explorer\\iexplore.exe",
"extensions":".*"
}
},
//safari
{ "keys": ["f4"], "command": "side_bar_files_open_with",
"args": {
"paths": [],
"application": "C:\\software\\Browser\\Safari\\safari.exe",
"extensions":".*"
}
},
//opera
{ "keys": ["f5"], "command": "side_bar_files_open_with",
"args": {
"paths": [],
"application": "C:\\software\\Browser\\opera\\opera.exe",
"extensions":".*"
}
}
]
ColorPicker 调色盘
在编辑CSS样式的时候,要加个自己喜欢颜色或改改颜色啥的,要到PS里去调色?ColorPicker可以让sublime text 3内置一个调色盘,调好颜色,点击OK就会在光标处生成十六进制颜色代码。
插件下载: https://github.com/weslly/ColorPicker
Hex-to-HSL-Color Hex颜色模式转HSL颜色模式
在用CSS3的一些属性时会用到HSL颜色模式,用软件转来转去确实麻烦,用Hex-to-HSL-Color这个插件便可轻松解决,鼠标选中一个或多个十六进制颜色代码,按下Shift+Ctrl+U立马转换为HSL颜色模式。
插件下载: https://github.com/atadams/Hex-to-HSL-Color
CSScomb CSS属性排序
有时候看看自己写的CSS文件,会不会觉得属性很乱查找不易维护难?CSScomb可以按照一定的CSS属性排序规则,将杂乱无章的CSS属性进行重新排序。选中要排序的CSS代码,按Ctrl +Shift + C
,即可对CSS属性重新排序了,代码从此简洁有序易维护,如果不款选代码则插件将排序文件中所有的CSS属性。当然,可以自己自定义CSS属性排序规则,打开插件目录里的CSScomb.sublime-settings
文件,更改里面的CSS属性顺序就行了。
插件下载: https://github.com/csscomb/CSScomb-for-Sublime
CSS Compact Expand CSS属性展开收缩
每个人写CSS都有不同的风格,有些人喜欢写成一行,有些人喜欢写成多行,各有各的好处,我倒喜欢将CSS写成一行,这样能减少CSS文件大小,且屏幕能显示更多的Class方便查找。如果阅读别人的代码不符合自己的习惯,可以用CSS Compact Expand这个插件将CSS格式化一下,按 Ctrl+Alt+[ 收缩CSS代码为一行显示,按 Ctrl+Alt+] 展开CSS代码为多行显示。
插件下载: http://pan.baidu.com/share/link?shareid=251331&uk=590661480&third=15
JsFormat javascript格式化
有时从网上扒了人家的JS代码来学习学习,打开发现被压缩了,这时就可以用JsFormat插件格式化js代码,恢复未压缩时候的排版,挺给力的。按快捷键Ctrl+Alt+F即可格式化当前的JS文件了。
插件下载: https://github.com/jdc0589/JsFormat
SublimeTmpl 快速生成文件模板
一直都很奇怪为什么sublime text 3没有新建文件模板的功能,像html头部的DTD声明每次都要复制粘贴。用SublimeTmpl这款插件终于可以解脱了,SublimeTmpl能新建html、css、javascript、php、python、ruby六种类型的文件模板,所有的文件模板都在插件目录的templates文件夹里,可以自定义编辑文件模板。
SublimeTmpl默认的快捷键:
HTML:
Ctrl+Alt+H
Javascript:Ctrl+Alt+J
CSS:Ctrl+Alt+C
PHP:Ctrl+Alt+P
Ruby:Ctrl+Alt+R
Python:Ctrl+Alt+Shift+P
如果想要新建其他类型的文件模板的话,先自定义文件模板方在templates文件夹里,再分别打开Default (Windows).sublime-keymap
、Default.sublime-commands
、Main.sublime-menu
、SublimeTmpl.sublime-settings
这四个文件照着里面的格式自定义想要新建的类型,这里就详细介绍了,请各位自己折腾哈~
插件下载: https://github.com/kairyou/SublimeTmpl
Emmet html/CSS快速编辑(原名Zen Coding)
Zen Coding估计大家都不会陌生,前不久改名为Emmet了,虽然用Emmet编辑html很快,但是要用好用快它需要付出不小的学习成本,学习的曲线有点陡峭,以至于让新手好奇而畏惧,我看看热闹就行了,感觉编辑得再快思维跟不上也是白搭,对我来说sublime text 3自带的代码提示够用了。网上有很多教学视频,有兴趣学习的可以去了解下。
插件下载: https://github.com/sergeche/emmet-sublime
SublimeLinter 代码错误提示
好话写在前面:SublimeLinter是少数几个能在sublime text 3工作的代码检查插件,SublimeLinter能检查HTML、CSS、Javascript、PHP等众多语言的错误代码并给出提示,前提是需要配置相应语言的环境,要检查JS代码需要安装node.js,检查PHP代码需要安装PHP并配置环境等,用这个插件能及时帮我们纠正代码的错误,并培养我们良好的编码习惯和风格。
丑话说在后面:对这货“强制性”的代码风格检查有点不爽,有意义无意义的代码提示经常打乱我敲代码的节奏,并且在后台运行检查机制造成Sublime text 3有点小卡顿,虽然部分问题可以设置SublimeLinter来解决,用了SublimeLinter一小段时间后还是放弃了,觉得代码提示对我应该没必要了。
插件下载: https://github.com/SublimeLinter/SublimeLinter/tree/sublime-text-3
以上插件只是个人觉得好用,各位就择你所好而用之,在win8下sublime text 3中测试工作正常,点击这里还可以查看更多 sublime text 3支持的插件 。细心的朋友也发现很多插件的快捷键重叠了,各位就依自己所好设置就行了。最后注意的是在github上下载插件时先看看插件有没有明确说明支持sublime text3,如果没有看看branch分支有没有st3版本的插件,不要下载错了插件版本。
5.运行环境设置
运行环境是Sublime Text 3一个比较蛋疼的问题,MCHakcer我到现在还是一知半解,但是,为了方便广大网友,我还是就我知道的说一下。
**
建议配置
**
一、MinGW
别的不说,就这货我还是建议装一下的,因为这货涵盖了几乎所有的代码解释器……
好吧,安装方法:打开链接下载MinGW.rar。
将里面的MinGW
文件夹整个复制到C盘根目录。并添加以下环境变量(系统变量,有则双击并添加,没有则创建并添加):
PATH
:C:\MinGW\bin;
LIBRARY_PATH
:C:\MinGW\lib;
C_INCLUDEDE_PATH
:C:\MinGW\include;
收工,接下来就是测试安装是否成功。
按Win+R
组合键或打开【开始菜单】-【运行】
,输入以下命令:cmd /c gcc -v & pause
如果你看到的界面是这样的:
那么恭喜你,安装成功。
但如果命令行显示“XXX不是内部或外部命令”,那么你悲催了,在重新进行一次安装吧……
二、JDK(Java Developer Kit)
好吧,这货只有玩Java的人才要,虽然已经出了8,但我还是建议下7,因为很多程序对它过敏……
打开链接下载JDK,安装好后,安装完JDK后配置环境变量 ,计算机→属性→高级系统设置→高级→环境变量
系统变量→新建 JAVA_HOME 变量
,变量值填写JDK的安装目录。
系统变量→寻找 Path 变量→编辑
,在变量值最后输入 %JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;
(注意原来Path的变量值末尾有没有;号,如果没有,先输入;号再输入上面的代码)
系统变量→新建 CLASSPATH 变量
,变量值填写 .;%JAVA_HOME%\lib;%JAVA_HOME%\lib\tools.jar
(注意最前面有一点)。·
检验是否配置成功 运行cmd 输入 java -version (java 和 -version 之间有空格)
按Win+R
组合键或打开【开始菜单】-【运行】
,输入以下命令:cmd /c java -version & pause
如果你看到的界面是这样的:
那么恭喜你,安装成功。
但如果命令行显示“XXX不是内部或外部命令”,那么你悲催了,在重新进行一次安装吧……
**
配置开发环境
**
首先到Github按下载提示单击
Download Zip
下载Zip文件,首先找到两个后缀名为.sublime-package
的文件,丢到安装目录的Package
目录下,还有一个runJava.bat
文件,丢到JDK安装目录的bin
下。打开Sublime Text 3,测试一下Java:
创建一个新的文件,输入:
public class Hello
{
public static void main(String[] args)
{
System.out.println("Develop Codes in Sublime Text 3!");
}
}
将编译系统设为Java
,保存后按Ctrl+Shift+B
编译运行,如果你看到的是这样:
那么欢呼吧!
在测试一下C++:
#include <iostream>
using namespace std;
int main()
{
cout<<"Develop Codes in Sublime Text 3!"<<endl;
return 0;
}
将编译系统设为C++,保存后按Ctrl+Shift+B
编译运行,如果你看到的是这样:
那么欢呼吧!
但是……
如果你看到的不是这样,去面壁思过吧……
6.写在后面
写了这么多,其实是蛮不容易的,虽然我已经尽了最大的努力但是由于水平所限,仍然可能有差错,欢迎大家通过微博@_MCHacker或发邮件至mcfun001@126.com来找我合作或提意见。最后一个请求,登陆你的微博关注并粉@_MCHacker,给作者一点小支持呗:)
By MCHacker……