国思软件 - 技术文章 - 前端神器-神级代码编辑软件Sublime Text下载、使用教程、插件推荐说明、全套快捷键

Sublime Text 是一个代码编辑器，也是HTML和散文先进的文本编辑器。Sublime Text是由程序员Jon Skinner于2008年1月份所开发出来，它最初被设计为一个具有丰富扩展功能的Vim。
Sublime Text具有漂亮的用户界面和强大的功能，例如代码缩略图，Python的插件，代码段等。还可自定义键绑定，菜单和工具栏。Sublime Text 的主要功能包括：拼写检查，书签，完整的 Python API ， Goto 功能，即时项目切换，多选择，多窗口等等。Sublime Text 是一个跨平台的编辑器，同时支持Windows、Linux、Mac OS X等操作系统。
Notepad++之类的无可比拟，前端必备的敲码工具，大量便捷的快捷键跟丰富神器的插件
## Sublime Text 特点

  1、Sublime Text 是一款跨平台代码编辑器，在Linux、OS X和Windows下均可使用。

  2、Sublime Text 是可扩展的，并包含大量实用插件，我们可以通过安装自己领域的插件来成倍提高工作效率。

  3、Sublime Text 分别是命令行环境和图形界面环境下的最佳选择，同时使用两者会大大提高工作效率。

  4、Sublime Text 为收费软件，建议有能力的人付费使用，以支持开发者。不过不购买也可以一直使用。

## 安装Sublime Text 3
官网: [http://www.sublimetext.com/3]( http://www.sublimetext.com/3)

![file](http://doc.rdiframework.net/blog/article/20180719095545790.png)

**注册码（学习目的，请支持正版）：**
```
适用于Sublime Text2同时也适用于Sublime Text3

ZYNGA INC.
50 User License
EA7E-811825
927BA117 84C9300F 4A0CCBC4 34A56B44
985E4562 59F2B63B CCCFF92F 0E646B83
0FD6487D 1507AE29 9CC4F9F5 0A6F32E3
0343D868 C18E2CD5 27641A71 25475648
309705B3 E468DDC4 1B766A18 7952D28C
E627DDBA 960A2153 69A2D98A C87C0607
45DC6049 8C04EC29 D18DFA40 442C680B

1342224D 44D90641 33A3B9F2 46AADB8F
```
选择对应的版本安装。完事后，要安装一个基础的、必备的包管理：Package Control，用来以后安装插件用的。

安装指导：[https://sublime.wbond.net/installation](https://sublime.wbond.net/installation)
```
import urllib.request,os,hashlib; h = '6f4c264a24d933ce70df5dedcf1dcaee' + 'ebe013ee18cced0ef93d5f746d80ef60'; 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)
```
打开ST3，点击菜单 View -> Show Console，会在底部出现一个命令输入框，然后将上面的命令拷贝到输入框中，回车，等待，安装成功。

如果在Perferences->中看到package control这一项，则安装成功。
![file](http://doc.rdiframework.net/blog/article/20180719094620221.png-pw)

## 常用插件安装
学习Sublime Text扩展插件的安装前，让我们来先了解一下它的插件官方网站：[https://packagecontrol.io/](https://packagecontrol.io/)
![file](http://doc.rdiframework.net/blog/article/20180719095826180.png-pw)

 当我们在搜索框中输入插件的关键字，相关的插件就会在下面实时显示出来，我们就可以选择自己想要的插件进行了解。
 ![file](http://doc.rdiframework.net/blog/article/20180719095936456.png-pw)
 
经过上面安装了Package Control后，我们就可以通过快捷键 Ctrl+Shift+P 打开 Package Control 来安装插件了。在打开的输入框中输入 install ，会根据你的输入自动提示，选择 Install Package。
![插件安装](http://doc.rdiframework.net/blog/article/20180719094152627.png)

等待，然后又会弹出一个输入框，让你输入你要安装的插件。
### ConvertToUTF8
我们要安装支持非UTF8编码的一个插件，只需要在输入框中输入 convert，自动匹配后，选择 ConvertToUTF8 插件，回车，等待，安装完毕，这样，ST就支持显示如 GBK 等编码的内容了。
![file](http://doc.rdiframework.net/blog/article/20180719094246665.png)

### ChineseLocalizations
一种让sublime汉化的插件
![file](http://doc.rdiframework.net/blog/article/20180719094831874.png)

### Emmet（原名 Zen Coding）
一种快速编写html/css的方法
![file](http://doc.rdiframework.net/blog/article/20180719094907234.png)

### BracketHighlighter
类似于代码匹配，可以匹配括号，引号等符号内的范围。
![file](http://doc.rdiframework.net/blog/article/20180719094929930.png)

### Autoprefixer
CSS3 私有前缀自动补全插件，显然也很有用哇
![file](http://doc.rdiframework.net/blog/article/20180719094959855.png)

### HTML-CSS-JS Prettify
功能说明：HTML、CSS、JS格式化。
插件地址：[https://github.com/victorporof/Sublime-HTMLPrettify](https://github.com/victorporof/Sublime-HTMLPrettify)
安装方法：安裝这个套件前必须先安裝node.js,指定 node.exe 的执行档所在位置。进而安装HTML-CSS-JS Prettify。
使用方法一：View -> Show console 或者使用快捷键(Ctrl + )，在命令列的地方輸入:view.run_command("htmlprettify")，然后按下Enter。
快捷键：ctrl+shift+h

### Colorpicker
使用一个取色器改变颜色
快捷键：ctrl+shift+c
![file](http://doc.rdiframework.net/blog/article/20180719095028929.png-pw)

### SyncedSidebarBg
自动同步侧边栏底色为编辑窗口底色
![file](http://doc.rdiframework.net/blog/article/20180719095049897.png-pw)

### DocBlockr　　
DocBlockr 可以自动生成 PHPDoc 风格的注释。它支持的语言有 Javascript, PHP, ActionScript, CoffeeScript, Java, Objective C, C, C++

### SideBar Enhancements　　
这个插件改进了侧边栏，增加了许多功能，如按F12调用浏览器查看页面

### Themr　　
主题管理，切换主题的时候，不用自己修改配置文件了，用这个可以方便的切换主题

### JsFormat 
格式化 js 代码

### Goto-CSS-Declaration 
安装后按快捷键 win 键 +Alt+. 跳转到 css 文件该 class 的声明处，方便修改查看，注意对应的css文件要同时打开才行.

### Prettify Code 
格式化 Html/CSS/JavaScript，一键让代码变整齐。

### Sublime?Linter 
自动提示补齐代码，支持 JavaScript、Python、PHP 等等常用语言。

### View In Browser 插件
功能说明：Sublime Text保存后网页自动同步更新。
插件地址：[https://github.com/adampresley/sublime-view-in-browser](https://github.com/adampresley/sublime-view-in-browser)
使用方法：在打开的文档任一处点右键，选择“View In Browser”，就会用默认的浏览器自动打开该文件。
![file](http://doc.rdiframework.net/blog/article/20180719101001344.png)
 如果你电脑装有多个浏览器，你想换其它的作为此操作的默认浏览器，你可以按以下方法设置：
 ![file](http://doc.rdiframework.net/blog/article/20180719101050377.png) 
 打开“View In Browser.sublime-settings”，写入以下代码：
 ```
 {
    "browser": "chrome64"
}
 ```
 ![file](http://doc.rdiframework.net/blog/article/20180719101154025.png)
 这样你就把它默认设置为“Chrome”浏览器了，当然你还可以改成“Firefox”、“Safari”等等，前提是你的电脑事先已安装好了这些浏览器。
 
 ### LiveReload 插件
功能说明：调试网页实时自动更新。
使用说明：快捷键 Ctr+Alt+V
插件地址：https://github.com/dz0ny/LiveReload-sublimetext2
![file](http://doc.rdiframework.net/blog/article/20180719101314709.png)
同时Chrome浏览器也要安装LiveReload 的扩展插件。
![file](http://doc.rdiframework.net/blog/article/20180719101341130.png-pw)

### TortoiseSVN 插件(win下需要安装有TortoiseSVN客户端支持)
功能说明：版本控制工具。
插件地址：https://github.com/dexbol/sublime-TortoiseSVN

### Theme-Soda 插件
功能说明：最受欢迎的 Sublime Text 主题之一。
插件地址：https://github.com/buymeasoda/soda-theme
安装完成后，点菜单 Preferences--->Settings - User，根据需要的主题效果，添加如下代码。
Soda 亮色主题请添加：
![file](http://doc.rdiframework.net/blog/article/20180719101626667.png-pw)
 Soda 暗色主题请添加：
```
 {
    "soda_classic_tabs": true,
    "theme": "Soda Dark 3.sublime-theme",
}
```
![file](http://doc.rdiframework.net/blog/article/20180719101703476.png-pw)

 要达到图中的效果，你还需要下载与之搭配的 color scheme。下载地址：http://buymeasoda.github.com/soda-theme/extras/colour-schemes.zip，如果你喜欢 Soda Dark 和 Monokai，我建议你使用 Monokai Extended。这个 color scheme 是 Monokai Soda 的增强，再配合 Markdown Extended ，将大大改善 Markdown 的语法高亮。
![file](http://doc.rdiframework.net/blog/article/20180719101725708.png)
如果加代码 "soda_classic_tabs":true，文件标签页形状会如下显示：
![file](http://doc.rdiframework.net/blog/article/20180719101744798.png)
如果不添加此行代码，文件标签页形状会如下显示：
![file](http://doc.rdiframework.net/blog/article/20180719101836523.png)

## 插件列表
快捷键 Ctrl+Shift+P，在对话框中输入“list”，选择“Package Control:List Packages”。
![file](http://doc.rdiframework.net/blog/article/20180719101910665.png)
会列出所有已安装的插件。这样可以很方便地了解自己已经安装了哪些插件。
![file](http://doc.rdiframework.net/blog/article/20180719101937641.png)

## 移除插件
有时候我们需要移除自己不想要的插件，具体操作如下：快捷键 Ctrl+Shift+P，在对话框中输入“remove”，选择“Package Control: Remove Packages”。
![file](http://doc.rdiframework.net/blog/article/20180719102406592.png-pw)
然后在出现的插件列表中点选你要移除的插件。
![file](http://doc.rdiframework.net/blog/article/20180719102417070.png-pw)

## 主要快捷键列表
掌握基本的代码编辑器的快捷键，能让你打码更有效率。刚开始可能有些生疏，只要花一两个星期坚持使用并熟悉这些常用的快捷键，今后就能解放鼠标了，省心省力又省时，何乐而不为呢。

以下是个人总结不完全的快捷键总汇，祝愿各位顺利解放自己的鼠标。

### 选择类
Ctrl+D 选中光标所占的文本，继续操作则会选中下一个相同的文本。
Alt+F3 选中文本按下快捷键，即可一次性选择全部的相同文本进行同时编辑。举个栗子：快速选中并更改所有相同的变量名、函数名等。

Ctrl+L 选中整行，继续操作则继续选择下一行，效果和 Shift+↓ 效果一样。

Ctrl+Shift+L 先选中多行，再按下快捷键，会在每行行尾插入光标，即可同时编辑这些行。

Ctrl+Shift+M 选择括号内的内容（继续选择父括号）。举个栗子：快速选中删除函数中的代码，重写函数体代码或重写括号内里的内容。

Ctrl+M 光标移动至括号内结束或开始的位置。

Ctrl+Enter 在下一行插入新行。举个栗子：即使光标不在行尾，也能快速向下插入一行。

Ctrl+Shift+Enter 在上一行插入新行。举个栗子：即使光标不在行首，也能快速向上插入一行。

Ctrl+Shift+[ 选中代码，按下快捷键，折叠代码。

Ctrl+Shift+] 选中代码，按下快捷键，展开代码。

Ctrl+K+0 展开所有折叠代码。

Ctrl+← 向左单位性地移动光标，快速移动光标。

Ctrl+→ 向右单位性地移动光标，快速移动光标。

shift+↑ 向上选中多行。

shift+↓ 向下选中多行。

Shift+← 向左选中文本.

Shift+→ 向右选中文本。

Ctrl+Shift+← 向左单位性地选中文本。

Ctrl+Shift+→ 向右单位性地选中文本。

Ctrl+Shift+↑ 将光标所在行和上一行代码互换（将光标所在行插入到上一行之前）。

Ctrl+Shift+↓ 将光标所在行和下一行代码互换（将光标所在行插入到下一行之后）。

Ctrl+Alt+↑ 向上添加多行光标，可同时编辑多行。

Ctrl+Alt+↓ 向下添加多行光标，可同时编辑多行。

### 编辑类
Ctrl+J 合并选中的多行代码为一行。举个栗子：将多行格式的 CSS 属性合并为一行。

Ctrl+Shift+D 复制光标所在整行，插入到下一行。

Tab 向右缩进。

Shift+Tab 向左缩进。

Ctrl+K+K 从光标处开始删除代码至行尾。

Ctrl+Shift+K 删除整行。

Ctrl+/ 注释单行。

Ctrl+Shift+/ 注释多行。

Ctrl+K+U 转换大写。

Ctrl+K+L 转换小写。

Ctrl+Z 撤销。

Ctrl+Y 恢复撤销。

Ctrl+U 自动读取图片宽高。

Ctrl+F2 设置书签

Ctrl+T 左右字母互换。

F6 单词检测拼写。

### 搜索类
Ctrl+F 打开底部搜索框，查找关键字。

Ctrl+shift+F 在文件夹内查找，与普通编辑器不同的地方是sublime允许添加多个文件夹进行查找，略高端，未研究。

Ctrl+P 打开搜索框。举个栗子：1、输入当前项目中的文件名，快速搜索文件，2、输入@和关键字，查找文件中函数名，3、输入：和数字，跳转到文件中该行代码，4、输入#和关键字，查找变量名。

Ctrl+G 打开搜索框，自动带：，输入数字跳转到该行代码。举个栗子：在页面代码比较长的文件中快速定位。

Ctrl+R 打开搜索框，自动带@，输入关键字，查找文件中的函数名。举个栗子：在函数较多的页面快速查找某个函数。

Ctrl+：打开搜索框，自动带#，输入关键字，查找文件中的变量名、属性名等。

Ctrl+Shift+P 打开命令框。场景栗子：打开命名框，输入关键字，调用sublime text或插件的功能，例如使用package安装插件。

Esc 退出光标多行选择，退出搜索框，命令框等。

### 显示类
Ctrl+Tab 按文件浏览过的顺序，切换当前窗口的标签页。

Ctrl+PageDown 向左切换当前窗口的标签页。

Ctrl+PageUp 向右切换当前窗口的标签页。

Alt+Shift+1窗口分屏，恢复默认1屏（非小键盘的数字）

Alt+Shift+2 左右分屏-2列

Alt+Shift+3 左右分屏-3列

Alt+Shift+4 左右分屏-4列

Alt+Shift+5 等分4屏

Alt+Shift+8 垂直分屏-2屏

Alt+Shift+9 垂直分屏-3屏

Ctrl+K+B 开启/关闭侧边栏。

F11 全屏模式

Shift+F11 免打扰模式
 
-----

 一路走来数个年头，感谢RDIFramework.NET框架的支持者与使用者，大家可以通过下面的地址了解详情。

  RDIFramework.NET官方网站：[http://www.rdiframework.net/](http://www.rdiframework.net/)

  [http://www.guosisoft.com/](http://www.guosisoft.com/)

  同时需要说明的，以后的所有技术文章以官方网站为准，欢迎大家收藏！

  RDIFramework.NET框架由专业团队长期打造、一直在更新、一直在升级，请放心使用！ 

 欢迎关注RDIFramework.NET框架官方公众微信（微信号：guosisoft），及时了解最新动态。

 扫描二维码立即关注
![](https://upload-images.jianshu.io/upload_images/1459766-dd771fda321417fa.jpg?imageMogr2/auto-orient/)

正文到此结束

所属分类：挨踢业界

本文标签： 挨踢业界常用工具
版权声明： 本站原创文章，由guosisoft.com发布，遵循 CC 4.0 by-sa 版权协议，转载请附上原文出处链接和本声明。

该篇文章的评论功能暂时被站长关闭

前端神器-神级代码编辑软件Sublime Text下载、使用教程、插件推荐说明、全套快捷键

热门推荐

相关文章

说给你听

本文目录

文章标签

网站信息

我们的产品

相关链接

关于我们

联系我们