[sublime系列文章] sublime text 3插件配置说明

sublime系列文章
sublime text 3如何设置宏
 sublime text 3插件配置说明
 sublime text 3构建系统

安装插件管理器

虽然可以手动安装,但是我并不推荐

使用Package Control组件安装

按Ctrl+`(此符号为tab按键上面的按键) 调出console（注：避免热键冲突）

粘贴以下代码到命令行并回车：


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 Text 3。
如果在Perferences->中看到package control这一项，则安装成功

使用插件管理器

按下Ctrl+Shift+P调出命令面板
输入install 调出 Install Package 选项并回车，然后在列表中选中要安装的插件。

插件列表

这些插件是我个人有配置过的插件,欢迎补充

A

1.Alignment

 1.1 作用:自动对齐插件
 1.2 setting:
     {
       "align_indent": false,
       "alignment_chars": ["=", ":"],
       "alignment_space_chars": ["=", ":"]
     }
1.3 key bindings:
    1.3.1 默认快捷键为ctrl+alt+a,  //但是这个快捷键和QQ截图冲突
    1.3.2 改成:[{ "keys": ["ctrl+alt+f"], "command": "alignment"}]
1.4 如果没有起作用,将"mid_line_tabs"设为true

2.AutoFileName

2.1 作用:文件路径提示功能
2.2 配置:
    解决问题:subliem text3 输入斜杠"/"会自动删除
    -> 在插件AFN的setting-user里添加一行,"afn_use_project_root": true即可

3.advancedNewFile

3.1 作用:快速创建文件,能直接输入路径创建文件
3.2 快捷键:windows:alt+ctrl+n Linux:super+alt+n

4.AllAutocomplete

4.1 作用:搜索全部打开的标签页

B

1.BracketHighlighter

 1.1 作用:括号高亮(就是在数字前面能显示括号配对)
 1.2 网上有更改配置,但是我懒得

2.Browser Refresh

2.1 保存文件自动刷新浏览器
2.2 配置快捷键: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"]
    }
}

C

1.ColorPicker

 1.1 作用:调出快捷面板,选取颜色
 1.2 快捷键:ctrl+shift+c

2.CTags

作用:代码跳转
安装
- 安装ctags可执行程序
  - http://prdownloads.sourceforge.net/ctags/ctags58.zip
  - 解压到一个目录(注意要是纯ASCII字符的目录不要带空格或中文命名的目录)
  - 假设我们解压在 D:Sublime_Text_Build_3176_x64ctags58 下
- 安装Ctags插件
  - 打开Package Control,进入install,搜索CTags并安装
  - (配置Ctags)
  - 打开Preferences->Package Settings->CTags->Settings - User
  - 在配置中输入
    
    {
```
"command": "D:/Sublime_Text_Build_3176_x64/ctags58/ctags.exe",  //这里输入你解压刚刚那个CTags库的路径
"autocomplete": "true"
```
    }
使用
- 右键文件夹列表,会出现Rebuild Tags选项,点击,生成.tags和.tags_sorted_by_file文件
快捷键列表(也可以自定义快捷键)

Command	KeyBinding	AltBinding	MouseBinding
rebuild_ctags	ctrl+t ctrl+r
navigate_to_definition	ctrl+t ctrl+t	ctrl+>	ctrl+shift+left_click
jump_back	ctrl+t ctrl+b	ctrl+<	ctrl+shift+right_click
jump_back_last_modification	ctrl+t ctrl+m
show_symbols	alt+s
show_symbols multi	alt+shift+s
show_symbols suffix	ctrl+alt+shift+s

3.Compare Side-By-Side

3.1 作用:代码比对插件

 1.1 作用:代码跳转
 1.2 网上有自己配置的,个觉人得用鼠标挺好的,懒得改

3.ConverToUTF8

3.1 作用:转码,但其实针对的是中文乱码
3.2 安装完之后,在file选项下可以看见

4.Clipboard Manager

4.1 作用:剪切板历史
4.2 操作:其余都正常,需要历史复制,只需要快捷键ctrl+k+v

5.codeFormatter

5.1 作用:格式化php代码
5.2 配置:"codeformatter_php_path": "php安装绝对路径/php.exe"
5.3 快捷键:ctrl+alt+F,个人更改为ctrl+o,ctrl+f
5.4 要求:对php的版本有要求,php版本必须在5.6.0及以上

6.Csscomb

6.1 作用:对CSS属性重新排序
6.2 使用:鼠标右键

D

1.Docblockr

 1.1 作用:补全注释
 1.2 setting
     类似如下配置,具体参数搜一下就有了
     "jsdocs_extra_tags": [
         "Create By SublimeText3",
         "@Author zjc",
         "@Date {{date}}",
     ]

2.Djaneiro

2.1 Djaneiro 支持 Django 模版和关键字高亮以及许多实用的代码片(snippets)功能

E

1.Emmet

1.1 作用:有一套Emmet语法，可以快速创建HTML标签。
1.2 按下Tab键，Emmet就能把一个缩写展开成一个HTML和CSS代码块

F

1.FindKeyConflicts用法

作用

查看sublime快捷键冲突

运行

这个插件可以通过在命令面板上指定命令来运行。

命令

命令按字母顺序列出，以修饰符（alt，cntl，shift，super）开头，后面跟着键。
FindKeyConflicts：所有键盘映射到快速面板：
FindKeyConflicts: All Key Maps to Quick Panel:

在快速面板中显示所有键映射。选择一个条目将打开一个缓冲区，并提供有关键绑定的更多详细信息

FindKeyConflicts：所有键映射到缓冲区：
FindKeyConflicts: All Key Maps to Buffer:

显示缓冲区中的所有键映射。

FindKeyConflicts：（直接）冲突到快速面板：
FindKeyConflicts: (Direct) Conflicts to Quick Panel:

该命令查找所有直接键冲突，并将其显示在快速面板上。该命令下列出的最后一个软件包是正在运行的命令的来源，如果不受上下文的限制。选择一个特定的条目将打开一个关于该键绑定细节的缓冲区。

FindKeyConflicts：（直接）冲突到缓冲区：
FindKeyConflicts: (Direct) Conflicts to Buffer:

在视图中显示键直接冲突。使用这将更好地了解命令如何冲突，因为命令的上下文将包含在输出中。列出的特定绑定的最后一个包是使用的命令，如果不受上下文的限制。

FindKeyConflicts：重叠冲突：
FindKeyConflicts: Overlap Conflicts:

显示与缓冲区中的多个部分键绑定重叠的键绑定。例如，如果[“ctrl + t”]作为一个绑定而存在，并且[“ctrl + t”，“t”]作为另一个绑定存在，则会显示。

FindKeyConflicts：所有冲突：
FindKeyConflicts: All Conflicts:

显示缓冲区中的所有冲突。这个选项将包括直接冲突和重叠冲突。

FindKeyConflicts：单包冲突：
FindKeyConflicts: Single Package Conflicts:

显示涉及所选包的冲突。

FindKeyConflicts：多包冲突：
FindKeyConflicts: Multiple Package Conflicts:

显示涉及所选软件包的冲突。选择（完成）当你完成选择包。您可以使用（查看选定）和（查看包）来查看选定的软件包和软件包列表。此外，您可以在查看所选软件包列表时按Enter键从选定列表中删除软件包。

FindKeyConflicts：命令搜索：
FindKeyConflicts: Command Search:

显示包含键盘映射文件的软件包列表。选择软件包后，快速面板中将显示命令列表。从后续列表中选择一个命令将运行该命令。

2.function name display

2.1 作用: 这个插件可以在状态栏显示出当前光标处于哪个函数中

3.FileBrowser

作用:你可以在新的侧边栏访问到您的项目目录,并在你的手不离开键盘的情况下进行导航

配置(最详细配置点这里)

Keybindings文件

{

  "keys": ["ctrl+o","ctrl+b"],
  "command": "dired",
  "args": {
  "immediate": true,
  "single_pane": true,
  "other_group": "left",
  "project": true
}

},
// 打开跳转列表(仅限ST3)
{ "keys": ["ctrl+o","ctrl+p"], "command": "dired_jump_list" }

2.Preferences-> Package Settings-> FileBrowser-> Settings -> User文件

    {
            // 打开ST3时,没有任何页面显示,则自动打开跳转列表(仅限ST3)
            "dired_hijack_new_window": "jump_list" ,
            //是否显示隐藏文件
            //"dired_show_hidden_files": false,
            //根据是否匹配,决定是否显示隐藏文件
            //"dired_hidden_files_patterns": [".*", "__pycache__", "*.pyc"] ,
            "dired_jump_points":
            {
                "controllers": "E:\\WWW\\Remote_fjrb\\controllers\\"
            },
            // 打开ST3时,没有任何页面显示,则自动打开跳转列表(仅限ST3)
            "dired_hijack_new_window": "jump_list",
            //是否自动刷新
            "dired_autorefresh":true,
            //如果您想在文件列表顶部看到标题
            "dired_header":true,
            //如果您希望在标签标题中看到完整路径，并在标签为焦点的情况下在窗口标题中显示
            "dired_show_full_path":false,
            //改变配色方案
            "color_scheme":"Packages/User/SublimeLinter/Mariana (SL).tmTheme",
            //改变字体
            //"font_face":"comic sans",
            //更改字体大小
            //"font_size":11.5
            //更改FileBrowser列的初始宽度（作为侧栏）
            // "dired_width":250,   //大约250像素
            "dired_width":0.2           //窗口的第五部分
    }

G

1.GitGutter

1.1 作用:改动文件时,它会在左侧显示行数的地方显示当前文件与最近一次提交时文件状态的不同

H

1.HTML-CSS-JS Prettify (需要node.js)

 1.1 作用:格式化代码
 1.2 Plugin Options
     {
     "node_path":
         {
             "windows": "D:/Program Files/nodejs/node.exe",
             "linux": "/usr/bin/nodejs",
             "osx": "/usr/local/bin/node"
         },
     }

I

J

1.jQuery

1.1 作用:jQuery代码提示

K

L

1.Local History

1.1 作用:每保存一次文件,就会产生一个文件的历史记录

M

1.Markdown Editing

1.1 作用:使sublime text3支持Markdown格式(即:example.md)
1.2 安装完就能用

1.3 由于默认是白色为底的主题,会瞎了眼睛,所以需要配置一下,配置文件如下

{

"color_scheme": "Packages/Color Scheme - Default/Mariana.sublime-color-scheme",
"line_numbers": true, //显然这个是显示行号的。
"draw_centered": false, // 改为false，原始值为true
"word_wrap": true,
"wrap_width": 120, // 每行字符数上限
"rulers": [],

}

2.OmniMarkupPreviewer

2.1 作用:
- 2.1.1 即写即看,快捷键:ctrl+alt+o
- 2.1.2 将标记导出为HTML,快捷键:ctrl+alt+x
- 2.1.3 将标记复制为HTML,快捷键:ctrl+alt+c
2.2 即写即看功能点击后出现404
- 2.2.1 Sublime Text > Preferences > Package Settings > OmniMarkupPreviewer > Settings - User
- 2.2.2 paste the following to remove the strikeout package.
  
  {
```
"renderer_options-MarkdownRenderer": {
    "extensions": ["tables", "fenced_code", "codehilite"]
}
```
  }

3.Modific

3.1 作用:标记代码的改变，支持git和svn
3.2 除了高亮变化，还可以通过按Ctrl + Alt + D来查看或比较当前的代码与最近提交的代码之间的区别

N

1.nginx

作用:nginx配置文件语法高亮(被动技能)

O

P

1.PhalconPHP Completions

1.1 作用:phalcon框架的函数,命名空间等自动补全

2.PHPNinJaManual

2.0 (已废弃)
2.1 作用:php函数手册
2.2 使用:在函数上右键

3.Python PEP8 Autoformat

3.1 作用:代码就会按PEP8要求自动格式化了
3.2 快捷键:ctrl+shift+r

4.pretty json

4.1 作用:格式化JSON
4.2 使用:用命令面板

Q

R

1.Requirementstxt

作用:Requirementstxt 可以为你的 requirements.txt文件提供自动补全，语法高亮以及版本管理功能

S

1.SideBarEnhancements

 1.1 作用:增强侧边栏
 1.2 setting
     1.2.1 在浏览器打开本地文件
          复制当前打开文件的路径
         { "keys": ["ctrl+shift+c"], "command": "copy_path" },
         这样写配置只是用浏览器打开本地文件,并不能实现通过服务器的方式打开
         chrome
         { "keys": ["f1"], "command": "side_bar_files_open_with",
             "args": {
                 "paths": [],
                 "application": "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe",    //路径要自己改
                 "extensions":".*" //匹配任何文件类型
             }
         },
         firefox
         { "keys": ["f2"], "command": "side_bar_files_open_with",
             "args": {
                 "paths": [],
                 "application": "D:\\Program Files\\Mozilla Firefox\\firefox.exe",    路径要自己改
                 "extensions":".*"
             }
          },
    1.2.2 以服务器的方式在览器打开(如下配置好后,只要在文件上右键,Open in Browser)
         Preferences → Package Settings → Side Bar → Settings User,打开了Side Bar.sublime-settings文件
         复制下列代码并保存
         {
             "default_browser": "firefox" one of this list: firefox, aurora, chrome, canary, chromium, opera, safari
         }
         文件（右键单击） → Project → Edit Preview URLS（点击），则打开SideBarEnhancement.json文件
         复制下面的代码，粘贴到SideBarEnhancement.json中，并保存。
         {
             "/Applications/MAMP/htdocs/":{    服务器入口
                 "url_testing": "http:localhost:80/";,    测试服务器地址
                 "url_production": "http:www.jianshu.com/";    上架之后服务器地址,这里随便填就行了
             }
         }

2.SFTP

2.1 作用:顾名思义,看不懂回家重修
2.2 使用,在文件上右键->Map to Remote,会创建一个文件,很多参数,主要更改如下参数
         type：是ftp还是sftp，自己填，这里填了port就会自动配的
         host：就是ftp/sftp的服务器地址了
         user：用户名
         password：密码
         port：type配了ftp默认是21，配了sftp默认是22，如果你端口特殊，那么就需要配置
         remote_path：链接后默认打开的远程目录
         ssh_key_file：这个是链接用的密钥，一般不用，我们链接服务器需要，所以我这里特别指出，要是没这功能，也就没这篇文章了，表扬作者，很强大{
         sftp_flags：这个配置我没搞明白，我猜是连接后，可以在服务器上执行一些shell命令，作者是这么说的，我英文不好，没完全明白，我也没试过，如果有需要的同学可以自己试试，要是真是这功能，那就厉害了

3.sublimeLinter

作用:代码检查
检查PHP
- 安装sublimeLinter-php (_如果环境变量里有php,不需要配置就直接能用,有环境变量_)
- 配置
  - 打开配置文件
    - Preferences->Package Settings->SublimeLinter->Settings - User (如果为空复制一份Settings - Default 到Settings - User)
  - 配置php路径
    - 搜索paths，找到下面的windows，配置php的绝对路径，不需要指向php.exe
  - 配置什么时候进行检查
    - 其中的lint_mode，表示运行模式，可选的值有background, load/save, save only, 和 manual
      
      save only，只有才保存时才进行检查
      background是自动检查
      mark_style，表示出错的显示样式(可选的值有"fill", "outline", "solid underline", "squiggly underline", "stippled underline", 和 "none"，默认值为outline)

检查JavaScript

安装sublimeLinter-jshint
安装node.js
打开终端,输入npm install -s jshint
最新版不需要配置,到这就可以是用了

_配置_(也就是网上所谓的写".jshintrc"文件):

打开配置文件Preferences->Package Settings->SublimeLinter->Settings - User

找到如下代码

//没有可以自己写
"jshint": {
    "@disable": false,
    "args": [],
    "excludes": []
},

变更成如下

"jshint": {
    "@disable": false,
    "args": [
    "--config",
    "F:\\WWW\\Gitee\\software\\Sublime_Text_Build_3143\\Data\\Packages\\User\\jshint.conf"],
    "excludes": []
},

解释

网上绝大多数的教程都说是要创建.jshintrc文件,然而windows下不能创建以"."开头的文件,也想办法创建出来了,就是不起作用.后来查找官网,得到如下内容

You can configure jshint options in the way you would from the command line, with .jshintrc files. For more information, see the jshint docs. You may provide a custom config file by setting the linter’s "args" setting to ["--config", "/path/to/file"]. On Windows, be sure to double the backslashes in the path, for example ["--config", "C:\Users\Aparajita\jshint.conf"].

官方明确说创建成jshint.conf的形式,也就是说,重要的是内容,而不是文件名

所以,这里需要两件事,

1.  需要有一个包好.jshintrc内容的文件(文件名重要,底下是找了一份还不错的文件)
        {
            "asi": true , //控制“缺少分号”的警告
            "boss": true , //控制“缺少分号”的警告
            "debug": true ,//"debug": true
            "evil": true , //控制 eval 使用警告
            "lastsemic": true ,//检查一行代码最后声明后面的分号是否遗漏
            "laxcomma": true , //检查不安全的折行，忽略逗号在最前面的编程风格
            "loopfunc": true , //检查循环内嵌套 function
            "multistr": true ,//检查多行字符串
            "notypeof": true , //检查无效的 typeof 操作符值
            "sub": true , //person['name'] vs. person.name
            "supernew": true , //new function () { ... } 和 new Object;
            "validthis": true //在非构造器函数中使用 this
        }
2.  需要在"args"中明确指定出该文件的地址,同时windons下的地址是反斜杠,需要转义.

        根据这两点才能得出上面的配置

查CSS
- 安装sublimeLiner-csslint
- 安装node.js,安装过可以省略
- 打开终端,输入npm install -s csslint
- 配置完成,已经可以用了
检查HTML
- 安装sublimeLinter-contrib-htmlhint
- 安装node.js,安装过可以省略
- 打开终端,输入npm install -g xg-htmlhint
- 配置完成,已经可以用了

4.sublimeCodeIntel

4.1 作用
    4.1.0 由于sublime自带代码自动补全,所以有可能产生以下问题
        >> 和sublime自身的代码补全冲突,发生错误
        >> 不装的话,js又无法自动补全
    4.1.1 代码自动补全(除JavaScript以外,其余需要配置环境)
    4.1.2 跳转到变量(原来好像只能在当前文件内跳转,但是现在已经可以跨文件了),函数(alt+click)
4.2 配置
4.3 依赖:需要安装codeintel

5.sublimegit

作用:git操作
将git协议切换成https协议
- 在.git目录下找到config文件,用文本编辑器打开
- 找到url对应的那一行,将url = git@github.com:manishnakar/polymer-demo.git;改成url = https://github.com/manishnaka... 即可

6.sublimerge 3

6.1 作用:比较文件差异
6.2 使用方法:"./Package/Sublime_Text3_Package_Sublimerge3.md"
6.3 官方网站:https://www.sublimerge.com/sm3/?from2x

7.SyncedSideBar

7.1 作用:每次打开文件，侧边栏都会同步显示该文件所在目录树中的位置(如果打开的文件是目录树的子集，还能将目录树自动展开)
7.2 使用:被动技能

8.SublimeLinter-pyflakes

8.1 作用:语法检查(其实是提供了pyflakes的接口)
8.2 依赖:sudo pip install pyflakes
8.3 配置:将pyflakes加入环境变量,不然就需要手动配置路径,不利于跨平台
8.4 注意:代码没有问题,但是出现了黄色方框,那是由于代码不符合pep8标准

9.SublimeLinter-pep8

9.1 作用:检查python代码是否符合pep8标准
9.2 依赖:sudo pip install pep8
9.3 配置:将pep8加入环境变量,不然就需要手动配置路径,不利于跨平台

T

1.TortoiseSVN

1.1 作用:SVN
1.2 要求:要安装TortoiseSVN客户端
1.3 更改setting(这个很简单)
1.4 其他很简单

2.Terminal

2.1 作用:调用终端
2.2 配置:我没改,使用默认
2.3 快捷键:ctrl+shift+t

3.Trailing spaces

__已经没必要使用:__因为sublime text 3的配置里可以设置保存的时候删除多余的空格

//一般建议不开,因为这样在代码比对的时候会产生非常多的不匹配代码
"trim_trailing_white_space_on_save": true,
作用:检测并一键去除代码中多余的空格
使用:没有设置快捷键,对于频率比较低的插件,直接使用ctrl+shift+p,调出命令模板,然后输入插件名即可

U

V

W

X

1.Xdebug Client

php安装Xdebug

新建一个phpinfo.php文件,键入如下代码

<?php
```
phpinfo();
```
?>
在浏览器中打开phpinfo.php文件
然后右键查看源码，然后将所有代码复制到这里https://xdebug.org/wizard.php...
上述页面分析完源代码之后,会在最下面告诉你需要下载的版本以及需要将其放到哪里，修改什么内容

配置PHP

修改php.ini文件,添加如下内容

[xdebug]

; 扩展地址
zend_extension="..\ext\php_xdebug.dll"
; 我用phpstudy配置的,这个是自带的
xdebug.profiler_output_dir="D:\phpStudy\PHPTutorial\tmp\xdebug"
xdebug.trace_output_dir="D:\phpStudy\PHPTutorial\tmp\xdebug"
; 这个是看文档上所需要的配置
xdebug.remote_enable=true
xdebug.collect_params=3
;xdebug.collect_return=1
xdebug.collect_vars=1
xdebug.collect_assignments=1
xdebug.collect_includes=1
xdebug.trace_format=0
xdebug.auto_trace=0
;xdebug.trace_options=1
;xdebug.profiler_enable = off
;xdebug.profiler_enable_trigger = off
;xdebug.profiler_output_name =cachegrind.out.%t.%p
xdebug.trace_output_name=trace.%H%R%t
;xdebug.show_local_vars=1
xdebug.remote_handler = dbgp
xdebug.remote_host= localhost
xdebug.remote_port = 9001
xdebug.cli_color=2
xdebug.show_exception_trace=0
xdebug.show_mem_delta=1
xdebug.var_display_max_children=-1
xdebug.var_display_max_data=-1
xdebug.var_display_max_depth=6

检查Xdebug安装是否成功

在浏览器中打开phpinfo.php文件
看是否显示Xdebug内容

Sublime_Text3 安装Xdebug插件

Ctrl+Shift+P,输入install,并点击Package Control：Install Package,打开插件管理
输入xdebug,选择__XDebug Client__插件

配置XDebug插件

由于Sublime Text 3不允许修改默认设置，仅允许我们修改用户设置，因此需要生成一份XDebug的用户设置后再修改。
打开Preferences菜单下的Package Settings二级菜单下Xdebug三级菜单中的“Settings - Default”，复制该窗口的所有内容
打开Preferences菜单下的Package Settings二级菜单下Xdebug三级菜单中的“Settings - User”，粘贴上一步复制的所有内容

修改第18行"url"配置为

  // 也就是根目录
  "url": "http://127.0.0.1/",

修改第30行"port"配置为

  // 该端口和前面配置php.ini文件设置的端口是一致的
  "port": 9999,

方法二

也可以配置项目
Project->Edit Project

在打开的文件中,键入如下内容
{

"folders":
[
    {
        // 这个地址打开的时候就有
        "path": "E:\\WWW"
    }
],
// 一下是需要新增的内容
"settings":
{
    "xdebug": {
        // 跟踪的路径
        "url": "http://localhost/",
        "super_globals": true,
        "close_on_stop": true,
        // 跟踪的端口
        "port":9001
    }
}

}

通过上述方法一或方法二配置后就可以调试了

调式PHP

XDebug Client调试快捷键：
Ctrl+F8: 填加/删除断点
Ctrl+Shift+F5: 运行到下一个断点
Ctrl+Shift+F6: 单步
Ctrl+Shift+F7: 步入
Ctrl+Shift+F8: 步出