安装插件

一、安装Package Control 组件

Package Control

Sublime安装Package control组件有两种方法:

第一种方法:

打开sublime界面,按Ctrl+shift+P组合键,然后可调出以下界面:

sublime安装python3 sublime安装package control_快捷键

 

 

搜索 install package,然后直接点击。

安装好后就会显示成功安装信息,点击确定即可。步骤较简单,不再附图说明

第二种方法:

打开sublime界面,按 Ctrl+`

然后粘贴以下代码到命令行并回车:

import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read()

 

sublime安装python3 sublime安装package control_快捷键_02

 

耐心等待安装即可。

最后看到以下组件显示就表示安装组件成功了。

sublime安装python3 sublime安装package control_快捷键_03

 

 

 

2、SideBarEnhancements 插件

功能说明:侧栏菜单扩充功能。插件地址:https://github.com/titoBouzout/SideBarEnhancements/tree/st3

安装方法一:

快捷键 Ctrl+Shift+p ,打开管理器。在顶部的悬浮对话框,输入 “install”, 然后下选点击 “Package Control: Install Package”。

sublime安装python3 sublime安装package control_Text_04

在出现的悬浮对话框中输入 “SideBar”, 然后点选下面的 “SideBarEnhancements ” 插件,就会自动开始安装,耐心等待即可

sublime安装python3 sublime安装package control_快捷键_05

安装过程中,在底端状态栏可看到安装过程

sublime安装python3 sublime安装package control_Text_06

安装成功后,下方会显示

“SideBarEnhancements successfully installed”,

表示安装完成,同时也可以根据下图中指示,查看插件是否成功安装

sublime安装python3 sublime安装package control_Text_07

该插件的效果如下:

sublime安装python3 sublime安装package control_Text_08

 

安装方法二:

 

可以下载完整的插件包后解压,放入Packages 目录下,以达到安装插件的目的。如何找到 Packages 目录?答:在“Sublime Text 3”顶部栏,点击菜单 “Preferences->Browse Packages...”

sublime安装python3 sublime安装package control_快捷键_09

会直接打开插件包存放的目录“Packages”然后你就可以把下载后解压好的插件包复制到这个 Packages 目录下。

当然,如果你熟悉 git,你还可以用 git 从插件的 GitHub 库直接克隆插件包到 Packages 目录下。

sublime安装python3 sublime安装package control_快捷键_10

安装步骤:

1、安装 Sublime text 3

安装过程较简单,不再截图赘述,正常安装成功后,双击创建好的桌面快捷方式。

之后设置如下内容:

①打开侧边栏:View -> Side Bar -> Show SideBar (Ctrl+B,Ctrl+K)

②打开上边栏:快捷键Ctrl + Shift + P进入管理器,输入View,选择Toogle Tabs

③设置字体及字体大小

菜单“Preferences--->Setting ”,

打开“Preferences.sublime-settings-User”

sublime安装python3 sublime安装package control_ide_11

 

如下图添加所需代码,根据自己的喜好进行设置。设置字体用"font_face":"字体名称",设置字体大小用"font_size":"字体大小",注意它们之间需要用逗号隔开。

sublime安装python3 sublime安装package control_快捷键_12

2、开始安装插件

2.1、安装Package Control 组件

Package Control

Sublime安装Package control组件有两种方法:

第一种方法:

打开sublime界面,按Ctrl+shift+P组合键,然后可调出以下界面:

 

sublime安装python3 sublime安装package control_sublime安装python3_13

 

搜索 install package control,然后直接点击。

安装好后就会显示成功安装信息,点击确定即可。步骤较简单,不再附图说明

第二种方法:

打开sublime界面,按 Ctrl+`

然后粘贴以下代码到命令行并回车:

import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read()

 

sublime安装python3 sublime安装package control_快捷键_02

 

耐心等待安装即可。

最后看到以下组件显示就表示安装组件成功了。

sublime安装python3 sublime安装package control_快捷键_15

 

2.2、SideBarEnhancements 插件

功能说明:侧栏菜单扩充功能。插件地址:https://github.com/titoBouzout/SideBarEnhancements/tree/st3

安装方法一:

快捷键 Ctrl+Shift+p ,打开管理器。在顶部的悬浮对话框,输入 “install”, 然后下选点击 “Package Control: Install Package”。

sublime安装python3 sublime安装package control_Text_04

在出现的悬浮对话框中输入 “SideBar”, 然后点选下面的 “SideBarEnhancements ” 插件,就会自动开始安装,耐心等待即可

sublime安装python3 sublime安装package control_快捷键_05

安装过程中,在底端状态栏可看到安装过程

sublime安装python3 sublime安装package control_Text_06

安装成功后,下方会显示

“SideBarEnhancements successfully installed”,

表示安装完成,同时也可以根据下图中指示,查看插件是否成功安装

sublime安装python3 sublime安装package control_Text_07

该插件的效果如下:

sublime安装python3 sublime安装package control_Text_08

 

安装方法二:

 

可以下载完整的插件包后解压,放入Packages 目录下,以达到安装插件的目的。如何找到 Packages 目录?答:在“Sublime Text 3”顶部栏,点击菜单 “Preferences->Browse Packages...”

sublime安装python3 sublime安装package control_快捷键_09

会直接打开插件包存放的目录“Packages”然后你就可以把下载后解压好的插件包复制到这个 Packages 目录下。

当然,如果你熟悉 git,你还可以用 git 从插件的 GitHub 库直接克隆插件包到 Packages 目录下。

sublime安装python3 sublime安装package control_快捷键_10

 

2.3、ConvertToUTF8 插件

功能说明:ConvertToUTF8 能将除UTF8编码之外的其他编码文件在 Sublime Text 中转换成UTF8编码,在打开文件的时候一开始会显示乱码,然后一刹那就自动显示出正常的字体,当然,在保存文件之后原文件的编码格式不会改变。

安装步骤:Ctrl+Shift+P面板,搜索插件 BracketHighlighter 点击安装即可。

 

2.4、BracketHighlighter 插件

功能说明:高亮显示匹配的括号、引号和标签。

sublime安装python3 sublime安装package control_快捷键_23

 

安装步骤:

1.

2.

 

sublime安装python3 sublime安装package control_快捷键_24

 

3. Ctrl+F 查询到 “bracket_styles”,把 {} 中注释的 // 都去掉,其中,color表示的设置选中部分的颜色,把该值改为以 brackethighlighter 开头,style则全部改成hightlight,注意:后面的逗号一定加上!

sublime安装python3 sublime安装package control_快捷键_25

 

2.5、Emmet 插件

 

功能说明:Emmet的前身是大名鼎鼎的Zen codin。前端开发必备,HTML 、CSS代码快速编写神器。

安装方法:Ctrl+Shift+P面板,安装插件

使用方法:默认快捷键 Tab/Ctrl+E

注意:Emmet 插件需要 PyV8 插件支持,所以在安装 Emmet 时,会自动安装 PyV8 插件,如果安装后 Emmet 不能正常使用,很可能是因为 PyV8 没有安装完全,Sublime Text 2 和 3 容易出现这个问题。你可以删除它,然后手动下载,采用方法二安装 PyV8 插件。

使用方法示例:

书写代码:ul#nav>li.item$*8>a{Item $},

然后把光标定在这行代码的最后面,按 Tab 键,就会自动生成:

sublime安装python3 sublime安装package control_Text_26

更多更详细的使用方法,请查阅 Emmet 官网:http://docs.emmet.io/

2.6、JsFormat 插件

功能说明:JavaScript代码格式化。

使用方法:在打开的JavaScript文件里点右键,选择JsFormat。

sublime安装python3 sublime安装package control_sublime安装python3_27

 

2.7、ColorHighlighter 插件

功能说明:显示所选颜色值的颜色,并集成了ColorPicker

使用方法: 在16进制的颜色值上点右键,选择“Insert color with color picker”,会弹性颜色拾色器

sublime安装python3 sublime安装package control_快捷键_28

在需要的色块上单击选择之后,颜色值和显示颜色都会相应做出改变

sublime安装python3 sublime安装package control_Text_29

 

2.8 Compact Expand CSS Command插件

功能说明:使CSS属性展开及收缩,格式化CSS代码。

使用方法:Ctrl+Alt+[ 收缩CSS代码为一行显示,Ctrl+Alt+] 展开CSS代码为多行显示。

快捷键Ctrl+Alt+[收缩CSS代码为单行显示:

sublime安装python3 sublime安装package control_Text_30

快捷键Ctrl+Alt+]展开CSS代码为多行显示:

sublime安装python3 sublime安装package control_sublime安装python3_31

 

2.9、SublimeTmpl 插件

功能说明:快速生成文件模板。

使用方法:SublimeTmpl默认的快捷键如下,如果快捷键设置冲突可能无效。

Ctrl+Alt+h 新建 html 文件

Ctrl+Alt+j 新建 javascript 文件

Ctrl+Alt+c 新建 css 文件

Ctrl+Alt+p 新建 php 文件

Ctrl+Alt+r 新建 ruby 文件

Ctrl+Alt+Shift+p 新建 python 文件

下图为快捷键 Ctrl+Alt+h 新建的一个 HTML 文件。

sublime安装python3 sublime安装package control_Text_32

相应的模板为tmpl格式的文件,保存在Packages 目录中 SublimeTmpl\templates 下:

sublime安装python3 sublime安装package control_sublime安装python3_33

 

当然我们可以根据自己的喜好来更改模板格式。例如,把自己 html 的模板另存为至相同的目录,更名为html.temp,类型选择为"All Files" 即可 。

现在按快捷键 Ctrl+Alt+H,新建一个 html 文件,其格式就和更改后模板格式完全一样了。如下图:

sublime安装python3 sublime安装package control_ide_34

 

2.10、Alignment 插件

 

功能说明:使代码格式的自动对齐。

安装方法:Ctrl+Shift+P面板,安装插件。

使用方法:快捷键 Ctrl+Alt+A,可能与QQ截图冲突,二者中的一个要重置快捷键。

sublime安装python3 sublime安装package control_Text_35

 

2.11、AutoFileName 插件

 

功能说明:自动补全文件(目录)名。

安装好后就可以来测试如何使用AutoFileName,先以html 为例,当输入href=””的同时,Sublime Text就会将现在编辑档案的路径为中心,判断该路径内的所有档案。以这个档案为范本它会去抓取跟 当前 html在同一层的档案列表。

sublime安装python3 sublime安装package control_ide_36

如果我们这次要link的是在某test资料夹内的 某文件,直接打上test/,就会跑出test资料夹内的档案,整个用法以此类推

如果需要连到上一层的 imgs 资料夹内的 test.png,那么在前面打..(上层),依序去选择路径即可

 

2.12、DocBlockr 插件

 

功能说明:快速生成 JavaScript (including ES6), PHP, ActionScript, Haxe, Java, C, CoffeeScript, TypeScript, Groovy, C++, Objective C and Rust语言函数注释。

使用方法:在函数上面输入/** ,然后按 Tab 就会自动生成注释。

sublime安装python3 sublime安装package control_sublime安装python3_37

 

2.13、HTML-CSS-JS Prettify 插件

 

功能说明:HTML、CSS、JS格式化。

安装方法:安裝这个套件前必须先安裝node.js,指定 node.exe 的执行档所在位置。进而安装HTML-CSS-JS Prettify。

使用方法一:

View -> Show console 或者使用快捷键(Ctrl + `),

在命令列的地方輸入:

view.run_command("htmlprettify")

然后按下Enter。

 

sublime安装python3 sublime安装package control_ide_38

 

使用方法二:

默认快捷键:Ctrl+Shift+H。

你也可以自行设置快捷键:菜单

“Preferences->Key Bindings–User”

里新增:

1. {
2. "keys": ["ctrl+shift+o"],
3. "command": "htmlprettify"
4. }

完成后保存,以上代码设定执行此插件的快捷键是:Ctrl+Shfit+O,自己设定的话就要测试一下,不要跟其他快捷键冲突。

 

2.16、Theme-Soda 插件

 

功能说明:最受欢迎 SublimeText 主题之一

安装完成后,点击菜单

Preferences--->Settings - User,

根据需要的主题效果,添加如下代码。

Soda 亮色主题请添加:

1. {
2. "soda_classic_tabs": true,
3. "theme": "Soda Light 3.sublime-theme",
4. }

Soda 暗色主题请添加:

1. {
2. "soda_classic_tabs": true,
3. "theme": "Soda Dark 3.sublime-theme",
4. }

sublime安装python3 sublime安装package control_Text_39

如果加代码 "soda_classic_tabs":true,文件标签页形状会如下显示:

sublime安装python3 sublime安装package control_快捷键_40

如果不添加此行代码,文件标签页形状会如下显示:

sublime安装python3 sublime安装package control_快捷键_41

 

除此之外,还有其他的Sublime Text 主题插件:

Theme-Flatland 插件

Theme-Nexus 插件

 

2.17、SublimeCodeIntel 插件

功能说明:智能提示。

2.18、LESS 插件

功能说明:LESS语法高亮显示。

安装方法:Ctrl+Shift+P面板,搜索 LESS 安装插件

3、查看插件列表

快捷键 Ctrl+Shift+P,在对话框中输入 “package control list”, 选择“Package Control: List Packages”。

sublime安装python3 sublime安装package control_ide_42

会列出所有已安装的插件。这样可以很方便地了解自己已经安装了哪些插件。

sublime安装python3 sublime安装package control_sublime安装python3_43

4、移除插件

有时候我们需要移除自己不想要的插件,具体操作如下:快捷键 Ctrl+Shift+P,在对话框中输入“remove”,选择“Package Control: Remove Packages”。

sublime安装python3 sublime安装package control_Text_44

然后在出现的插件列表中选你要移除的插件。

sublime安装python3 sublime安装package control_Text_45

5、 Sublime Text 的窗口操作

1、分屏

Sublime Text有多种分屏形式,让我来具体地看一看。菜单 “View-Layout”就可以选择你的分屏样式。

sublime安装python3 sublime安装package control_快捷键_46

对应的快捷键与分屏情况如下:

Alt+Shift+1 Single 独屏

Alt+Shift+2 Columns:2 纵向二栏分屏

Alt+Shift+3 Columns:3 纵向三栏分屏

Alt+Shift+4 Columns:4 纵向四栏分屏

Alt+Shift+8 Rows:2 横向二栏分屏

Alt+Shift+9 Rows:3 横向三栏分屏

Alt+Shift+5 Grid 四格式分屏

sublime安装python3 sublime安装package control_快捷键_47

 

2、创建新窗

快捷键Ctrl+Shift+N 创建一个新窗口。

sublime安装python3 sublime安装package control_sublime安装python3_48

 

至此,恭喜,SublimeText3 常用且高效的插件已经成功安装了。