Sublime Text各类插件使用方法

时间  2019-11-12
标签 sublime text 各类 插件 使用方法 栏目 HTML 繁體版
原文   原文链接

有快捷键冲突的时候能够修改快捷键，建议修改插件快捷键而不是Sublime Text的快捷键，个人有冲突的一概将插件快捷键设置成：Ctrl+Alt+A(B...)

Package Control

通俗易懂地说，这个是你在完成安装SublimeText后必须安装的东西。你问为何？由于有了这个特殊的“插件包”，你能够很容易地安装、升级、删除，甚至很是方便地查看您已经安装在SublimeText中的包或插件的列表。它经过菜单和对应的行为使这些过程变得很是容易和有组织。css

Emmet(快捷键为Ctrl+E，习惯用Tab)

归纳地说，Emmet（译者注：前身就是之前大名鼎鼎的Zen Coding，这个若是你没据说和使用过，就悲哀了）是一个可让你更快更高效地编写HTML和CSS，节省你大量时间的插件。怎么使用？你只需按约定的缩写形式书写而不用写整个代码，而后按“扩展”键，这些缩写就会自动扩展为对应的代码内容。 好比，你只须要输入 ((h4>a[rel=external])+p>img[width=500 height=320])*12 ，而后它会被扩辗转换成12个列表项和紧随其后的图像。而后你就能够在此基础上再填写内容，就这么简单。html

生成一个html空模版文件node

html:xt->Tabgit

Emmet插件

生成多个元素，例如20个div：程序员

div*20->Tabgithub

Emmet插件1

生成子元素，例：div->ul->li->a->img 写法编程

div>ul>li>a>img->Tabvim

Emmet插件3

生成同级别元素，例：div->ul+div 写法windows

div>ul+div->Tabsublime-text

Emmet插件4

生成向上层元素，例：div->ul->上一层添加一个ul 写法

div>ul^ul->Tab

Emmet插件5

生成带序号的元素

h$*6->Tab

生成带id或class元素，id写法#id名->Tab ，class写法 .class名->Tab

Emmet插件6

Alignment

这个插件让你能对齐你的代码，包括 PHP、CSS 和 Javascript。代码看起来更简洁和可读，便于编辑。默认是Ctrl+Alt+A，哇，齐了。

Sublime-HTMLPrettify

Ctrl + Shift + H，可格式化HTML，CSS，JS，XML等，至关于功能是JsFormat，CssCond，sublimetext_indentxml的结合，功能强大，我的把他设置为了Ctrl + Shift + F，同时须要下载node.js，将node.js的路径配置进去就好了，可是对JSON的格式化不是那么使人满意，因此仍是加了JsFormat这个插件

JsFormat

Ctrl+Alt+F  格式化js代码

WebInspector 

在 JavaScript调试方面，这是一个使人惊讶的工具，Sublime上的完整的代码检查工具。
功能：使用绝对路径储存在用户设置中的项目断点，控制台，分步和断点调试器，栈追踪。这些都可以很棒的工做！并且Mozilla还提供了一个插件Fireplay让你链接到Firefox 开发工具和最简单的调试器JSHint

CSSComb

这是用来给CSS属性进行排序的格式化插件。若是你想保持的代码干净整洁，而且但愿按必定的顺序排列（是否是有点强迫症了？），那么这个插件是一种有效解决的方案。特别是当你和其余有本身代码编写风格的开发者一同协做的时候。

使用方法：Ctrl + Shift + C

sublimetext_indentxml

对XML进行格式化，Ctrl + K + F

AllAutocomplete

Sublime Text 默认的 Autocomplete 功能只考虑当前的文件，而 AllAutocomplete 插件会搜索全部打开的文件来寻找匹配的提示词，无需重启便可生效。

BracketHighlighter

用于匹配括号，引号和html标签。对于很长的代码颇有用。安装好以后，不须要设置插件会自动生效。好极了！打开和折叠代码的某一部分就应该是这个样子的。

SideBarEnhancements

这个插件能够给SublimeText的边栏菜单带来扩充的功能，包括：在当前工程文件夹中新建文件，移动文件或文件夹，产生文件或文件夹的副本，在新窗口或浏览器中打开，刷新等。这只是归纳地说，安装后探索它更多的功能吧。

修改  Side Bar.sublime-menu文件能够去除不须要的功能，个人最后修改为这样，效果和代码以下：

[
    {
        "caption": "-",
        "id": "side-bar-start-separator"
    },

    {
        "command": "prompt_add_folder",
        "caption": "Add Folder to Project…",
        "mnemonic": "d"
    },
    
    {
        "caption": "-",
        "id": "side-bar-new-separator"
    },

    {
        "caption": "Open In Browser",
        "id": "side-bar-open",
        "command": "side_bar_open",
        "args": {
            "paths": []
        }
    },

    {
        "caption": "Open the Folder",
        "id": "side-bar-reveal",
        "command": "side_bar_reveal",
        "args": {
            "paths": []
        }
    },

    {
        "caption": "-",
        "id": "side-bar-edit-open-separator"
    },

    {
        "caption": "-",
        "id": "side-bar-find-separator"
    },
    {
        "caption": "Copy Name",
        "id": "side-bar-clip-copy-name",
        "command": "side_bar_copy_name",
        "args": {
            "paths": []
        }
    },

    {
        "caption": "Copy Path (Windows)",
        "id": "side-bar-clip-copy-path-windows",
        "command": "side_bar_copy_path_absolute_from_project_encoded_windows",
        "args": {
            "paths": []
        }
    },
    {
        "caption": "Copy Dir Path",
        "id": "side-bar-clip-copy-dir-path",
        "command": "side_bar_copy_dir_path",
        "args": {
            "paths": []
        }
    },
    {
        "caption": "Copy Path",
        "id": "side-bar-clip-copy-path",
        "command": "side_bar_copy_path",
        "args": {
        "paths": []
        }
    },
    {
        "caption": "Copy Folder Path",
        "id": "side-bar-clip-copy-project-directories",
        "command": "side_bar_copy_project_directories",
        "args": {
        "paths": []
        }
    },

    {
        "caption": "-",
        "id": "side-bar-clip-separator"
    },

    {
        "caption": "Rename…",
        "id": "side-bar-rename",
        "command": "side_bar_rename",
        "args": {
            "paths": []
        }
    },
    
    {
        "caption": "-",
        "id": "side-bar-duplicate-separator"
    },

    {
        "caption": "Duplicate…",
        "id": "side-bar-duplicate",
        "command": "side_bar_duplicate",
        "args": {
            "paths": []
        }
    },
    
    {
        "caption": "-",
        "id": "side-bar-rename-move-separator"
    },

    {
        "caption": "Empty",
        "id": "side-bar-empty",
        "command": "side_bar_empty",
        "args": {
            "paths": []
        }
    },
    {
        "caption": "-",
        "id": "side-bar-delete-separator"
    },

    {
        "caption": "Refresh",
        "id": "side-bar-refresh",
        "command": "refresh_folder_list"
    },
    {
        "caption": "-",
        "id": "side-bar-refresh-separator"
    },
]

Git

Sublime Test Git插件下载地址

虽然名字看上去并不友好，但做为开发者的你确定一眼就能明白它是干什么的。这个插件会将Git整合进你的SublimeText，使的你能够在SublimeText中运行Git命令，包括添加，提交文件，查看日志，文件注解以及其它Git功能。

GitGutter或者Modific

这是一个小巧有用的插件，它会告诉你自上次git commit以来已经改变的行。一个指示器显示在行号的旁边。

DeleteBlankLines

删除所有空行：

注意:
若是行中带有tab或空格字符则不会被删除,只删除只含有\n或\r的空行
在Windows操做系统中:
Ctrl+Alt+Backspace -- 删除全部空行
Ctrl+Alt+Shift+Backspace -- 删除多余空行
 
在OSX操做系统中:
Ctrl+Alt+Delete -- 删除全部空行
Ctrl+Alt+Shift+Delete -- 删除多余空行
 
在Linux操做系统中:
Ctrl+Alt+Backspace -- 删除全部空行
Ctrl+Alt+Shift+Backspace -- 删除多余空行

EditorConfig

EditorConfig帮助开发者在不一样的编辑器，IDE之间定义和维护统一的编程风格。EditorConfig工程包含一个文件，定义了编程风格，文本编辑器插件集合，让编辑器能够读取该文件并依照它来定义风格。例如.editorconfig文件：

对比查找两个文档的不一样Sublimerge Pro

打开Sublime Text后，接着按 Ctrl+Shift+P，并输入  Install Package ，安装完成以后选择 Compare to View

Colorpicker

若是你常常要查看或设置颜色值，这个插件能够很方便地调用你本机的调色板应用。（译者扩充：）这是一个双向的功能，你既能够在调色板中选择一个颜色，而后按“肯定”按钮把该值填写到 SublimeText 中活动文档的当前位置，也能够在活动文档中选择一个颜色的值，按此插件的快捷键就会在显示的调色板中定位到该值所对应的颜色。

使用方法: Ctrl + Shift + C

DocBlockr

DocBlockr 可使你很方便地对代码创建文档。它会解析函数，变量，和参数，根据它们自动生成文档范式，你的工做就是去填充对应的说明。

Floobits

SublimeText, Vim, Emacs, IntelliJ IDEA极佳的扩展工具，它使得开发者能够在从不一样的编辑器合做编写代码。

AutoFileName

自动补全文件路径-很是方便。没有废话。

PlainTasks

杰出的待办事项表！全部的任务都保持在文件中，因此能够很方便的把任务和项目绑定在一块儿。能够建立项目，贴标签，设置日期。有竞争力的用户界面和快捷键。

SublimeREPL

这多是对程序员最有用的插件。SublimeREPL 容许你在 Sublime Texxt 中运行各类语言（NodeJS ， Python，Ruby， Scala 和 Haskell 等等）。

MarkdownEditing

多是Markdonw最好的插件了：语法高亮，缩略词，自动补全，配色方案。你也能够尝试使用MarkdownPreview做为替代解决方案。

MarkdownPreview

SublimeText不只仅是可以查看和编辑 Markdown 文件，但它会视它们为格式很糟糕的纯文本。这个插件经过适当的颜色高亮和其它功能来更好地完成这些任务。

CodeIntel

Sublime CodeIntel是我最喜欢的插件，它提供了不少IDE提供的功能，例如代码自动补齐，快速跳转到变量定义，在状态栏显示函数快捷信息等。

它支持的语言有：PHP, Python, RHTML, JavaScript, Smarty, Mason, Node.js, XBL, Tcl, HTML, HTML5, TemplateToolkit, XUL, Django, Perl, Ruby, Python3.

虽然有时候有点小问题，但真的能节省不少时间。强烈推荐安装。

Terminal

这个插件可让你在Sublime中直接使用终端打开你的项目文件夹，并支持使用快捷键。默认是Ctrl+Alt+T  调出控制台，快捷键跟Sublime Text冲突，须要修改快捷键，个人修改成Ctrl+Alt+T

Prefixr

因为CSS3和HTML5的W3C规范都还没有统一，各大浏览器对标准的支持仍是有差别的。因此在编写CSS3代码还须要针对不一样的浏览器写一堆的CSS3代码前缀。Prefixr插件能将CSS3代码自动生成跨浏览器CSS代码。

JSLint

JSLint是一个Javascript代码质量检测工具。它能够告诉你代码的什么地方须要改进。虽然你也能够在网上检测，但这个插件能让你不打开浏览器，直接在Sublime里面检测。

使用方法：按下Shift + Command + P(Mac)或是Ctrl + Shift + P(Windows)调出命令面板，找到JSLint: Run JSLint，按下Enter，JSLint会输出结果到状态栏。

Linter

这个插件最近才为SublimeText3重建和发布。新版本显然带来了不少新的有所不一样的功能，而不是简单地把全部的Linter 放在一个包中，开发者容许用户在升级时选择并安装本身常用的Linter。很明显，这能够节省磁盘空间。“更多的定制”，这对用户是很友好的。

CanIUse

若是您想检查浏览器是否支持你包括在你的代码中的CSS和HTML元素，那么这是你须要的插件。全部您须要作的就是选择有疑问的元素，插件将为你作其他的事情。

FTPSync

默认状况下SublimeText不具有FTP的功能，若是你正在寻找能在您的SublimeText应用程序中使用的免费和易用的FTP工具，你能够考虑FTPSync。这是一个很是简单的FTP同步工具，它能够控制上传目标的多重命名。让咱们知道您的想法。

SASS Build

SASS Build 是一个编写CSS的预处理器。这个特别的插件将帮助你妥善构建包括压缩选项在内的SASS文件。一旦你安装了这个插件，你能够很容易地经过按Ctrl+ B（MAC系统是 Command +B）来启动它。

PackageResourceViewer

经过这个特殊的插件，会给你查看和编辑SublimeText附带的不一样的包带来不少方便。您也能够提取任何给定的包。这一行动将其复制到用户文件夹，以便您能够安全地对其进行编辑。

Trmmer

你知道当你编写代码时，因为错误或别的某些缘由，会产生一些没必要要的空格。须要注意的是多余的空格有时也会形成错误。这个插件会自动删除这些没必要要的空格。

FileDiffs

这个插件容许你看到SublimeText中两个不一样文件的差别。你能够比较的对象能够是从剪贴板中复制的数据，或工程中的文件，当前打开的文件等。

  • Sublime SFTP
  • CTags – 让Sublime Text支持CTags.
  • ActualVim – Vim in Sublime – 两个最爱的编辑器合二为一.
  • SublimeLinter – 行内语法检测插件，支持： C/C++, Java, Python, PHP, JS, HTML, CSS, etc.
  • FixMyJS, Jsfmt and JsFormat – JS/JSON代码风格格式化.
  • AStyleFormatter – C/C++/C#/Java 代码风格格式化.
  • SVG-Snippets – 一套 SVG 代码片断.
  • Inc-Dec-Value – 增长或减小数字, 日期, 十六进制彩色值等等。
  • Trailing Spaces – 高亮空白结尾并快速删除它们
  • Placeholders – 带有文本，图片，列表，表格等的占位用代码片断
  • ApplySyntax – 快速语法检测
  • StylToken – 容许以不一样的颜色高亮特定的一段文本 (相似和notepad++ 的Style token功能).
  • EasyMotion – 快速跳转到任何当前激活视图而已看到区域的字符
  • ZenTabs 和Advanced?New?File – 改进默认tab样式和文件建立.
  • EncodingHelper – 猜想文本的编码方式，在状态栏显示，从不一样的编码形式转换到UTF-8
  • Gist – 同步GitHub Gist和Sublime (ST2).

  • Clipboard History (ST2) – 为的剪切板保存历史记录

相关文章
相关标签/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公众号
   欢迎关注本站公众号,获取更多信息
联系我们 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程