Sublime Text 2安装的插件和所有预置的插件全部在Packages文件下,可以直接通过”preferences“—>”Browse Pakcages“来访问。

  Sublime Text 2安装插件有两种方法:
  1)离线安装,先下载好安装包,解压之后放到Packages文件夹下,重启Sublime即可。
          离线安装包下载地址:http://sublime.wbond.net/Package%20Control.sublime-package

  2)在线安装,在线安装之前,需要安装”Packages Control“这个包管理插件,安装方法是:
    选择”查看“—>”显示控制台“,然后在下面弹出的框中输入:

import urllib2,os;pf='Package Control.sublime-package';ipp=sublime.installed_packages_path();os.makedirs(ipp) if not os.path.exists(ipp) else None;open(os.path.join(ipp,pf),'wb').write(urllib2.urlopen('http://sublime.wbond.net/'+pf.replace(' ','%20')).read())

然后回车确认,安装完毕之后重启sublime,如果发现在Perferences中看到package control这一项,则安装成功。

然后我们按住 ctrl+shift+p。此时会输出一个输入框, 输入install。 
选择package contrl: install package 回车 ,需要稍定一会儿,右下角状态栏会显示正在连接的提示文字。
使用sublime时注意看右下角状态栏,很多插件的提示信息都显示在这里,这个状态栏很小,初次使用的人都有可能没有注意到它。

稍等一会儿后,它会出现一个插件列表, 你也可以在输入框中输入文字进行搜索插件。 搜索到自己想安装的插件,再选择它,回车。 就自动给你安装好了。

如果要卸载插件, ctrl+shift+p 输入 remove, 选择package control:remove package 然后再选择已安装的插件, 回车即可卸载。

当然也可以这样:Preferences--> package control  选择安装和移除插件

点击Install Package之后,稍等一会,就出先搜索安装的列表

下面正式推荐几款必备的常用插件:

1.SublimeTmpl插件

  这个插件允许用户定义文件的模板,比如在写一个html文件时,老是重复文件头的一些引入信息很繁琐,可以定义一个模板直接生成必须的信息,具体的SublimeTmpl插件用法请自行百度。

2.Emmet(Zen Coding)

大名鼎鼎的Zen Coding改名作Emmet啦,Zen Coding的Sublime Text 2插件也不再更新,现在整个项目搬到了Emmet了。仅仅需要一行代码就能快速生成html代码。

完整语法请参考:http://docs.emmet.io/cheat-sheet/

ul#nav>li.item$*4>a{Item $}

你只需要按下control + E,代码就会自动展开成:

<ul id="nav">
<li class="item1"><a href="">Item 1</a></li>
<li class="item2"><a href="">Item 2</a></li>
<li class="item3"><a href="">Item 3</a></li>
<li class="item4"><a href="">Item 4</a></li>
</ul>

3.Sublime CodeIntel

Sublime CodeIntel是我最喜欢的插件,它提供了很多IDE提供的功能,例如代码自动补齐,快速跳转到变量定义,在状态栏显示函数快捷信息等。
它支持的语言有:PHP, Python, RHTML, JavaScript, Smarty, Mason, Node.js, XBL, Tcl, HTML, HTML5, TemplateToolkit, XUL, Django, Perl, Ruby, Python3.
虽然有时候有点小问题,但真的能节省很多时间。强烈推荐安装。

4.Prefixr

由于CSS3和HTML5的W3C规范都尚未统一,各大浏览器对标准的支持还是有差异的。所以在编写CSS3代码还需要针对不同的浏览器写一堆的CSS3代码前缀。Prefixr插件能将CSS3代码自动生成跨浏览器CSS代码。

使用方法:

.box {
border-radius: 10px;
box-shadow: 0 0 5px rgba(0,0,0,.4);
}

按下ctrl + Alt + X(Windows)或者control + command + X(Mac) ,会转换成:

.box {
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px; -webkit-box-shadow: 0 0 5px rgba(0,0,0,.4);
-moz-box-shadow: 0 0 5px rgba(0,0,0,.4);
box-shadow: 0 0 5px rgba(0,0,0,.4);
}

5.为了避免打开含中文字符的文件出现乱码,需要先安装GBK Encoding Support这个插件,再安装ConvertToUTF8插件即可。

6.AndyJS2插件:一款针对Javsscript和jquery智能提示的插件。

7.jquery插件:jquery提示库。

其他还有很多插件或者配置,就不一一列举了,希望大家共同探讨...

插件介绍地址:https://sublime.wbond.net/

Sublime Text 2中前端必备的常用插件的更多相关文章

  1. Sublime Text 2/3安装使用及常用插件

    一.介绍 Sublime Text 是一款较新的编辑器,它轻量.简洁.高效,良好的扩展性以及跨平台等特性,使得越来越多的开发人员喜爱.它是一款收费的商业软件,但可以免费无限制无限期的试用,只会偶尔提醒 ...

  2. Sublime Text 3安装与使用 Package Control 插件安装

    原文地址:http://www.cnblogs.com/zhcncn/p/4113589.html 本文是Sublime Text 全程指引 by Lucida (http://www.cnblogs ...

  3. sublime text 3中emmet常用技巧

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. Sublime Text 使用指南 - 前端开发神器

    Sublime Text 前端开发的神器 Sublime Text是一个前端开发者必备的编辑器,大量的插件,完善的功能,优越的性能,有非常多的特色,给前端开发提供了一个完善的开发条件. 本文主要介绍的 ...

  5. 在 Sublime Text 2 中使用 SFTP 插件快速编辑远程服务器文件

    在 Sublime Text 2 中使用 SFTP 插件快速编辑远程服务器文件 开源程序 浏览:29555 2013年05月02日 文章目录[隐藏] 常见的工作流程 SFTP 安装和使用方法 第一步: ...

  6. Sublime Text 2中自定义代码模板

    Sublime Text 2中自定义代码模板 2012-12-06 10:13 9921人阅读 评论(0) 收藏 举报  分类: 编辑器-Sublime Text 2(5)  版权声明:本文为博主原创 ...

  7. 在sublime text 3中设置浏览器预览快捷键

    1.安装 SideBarEnhancements ctrl+shift+p,进入命令模式,然后输入package control(或者直接输 pci 或许也行),回车: 输入:SideBarEnhan ...

  8. 在Sublime Text 3 中安装SublimeLinter,Node.js进行JS&CSS代码校验

    转载自:http://www.wiibil.com/website/sublimelinter-jshint-csslint.html 在Sublime Text中安装SublimeLinter,No ...

  9. Sublime text 3 中Package Control 的安装与使用方法和解决Sublime Text 3不能正确显示中文的问题

    Sublime text 3 中Package Control 的安装与使用方法,英文好可以在这个网址看看, 下面简单的说明一下 : https://packagecontrol.io/install ...

随机推荐

  1. HTML5 UTF-8 中文乱码

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. ASP.NET MVC- Controllers and Routing- Routing

    二.Creating Custom Routes In this tutorial, you learn how to  add a custom route to an ASP.NET MVC ap ...

  3. eclipse+tomcat+httpServlet初学

    1.在eclipse中配置tomcat,参考上一边文章,建立的web项目tomcatWeb目录结构 2.添加Servlet处理类 3. 实现doGet()与doPost()方法: <span s ...

  4. 后台action处理数据传递给前台界面

    package com.renmai.util; import java.io.IOException; import javax.servlet.http.HttpServletResponse; ...

  5. EasyUI-增删改操作

    最近公司要用easyui,这里自己看了官网几篇文章,遇到些问题,大多数的问题都是敲代码的时候笔误,其他有些地方确实需要注意一下,这里做些笔记. 1.在mysql中建好表之后修改id字段为递增字段,发现 ...

  6. The TCP/IP parameters for tweaking

    The TCP/IP parameters for tweaking a Linux-based machine for fast internet connections are located i ...

  7. 2014-08-05 pig

    Pig的数据类型能够分为两种:一种是scalar类型,包含单一的value,一种是complex类型,包含有其他的类型. 对于scalar类型: int,long,float,double,chara ...

  8. 项目FAQ

    报错: Conversion from String Literal to Char* is deprecated http://stackoverflow.com/questions/1369030 ...

  9. JS家的排序算法

    由于浏览器的原生支持(无需安装任何插件),用JS来学习数据结构和算法也许比c更加便捷些.因为只需一个浏览器就能啪啪啪的调试了.比如下图我学习归并排序算法时,只看代码感觉怎么都理解不了,但是结合chro ...

  10. ios中创建可以拖动的view原理和实现详解

    有时候我们会需要在界面上拖动view;uiview是继承于uiresponder的,所以可以响应触摸相关的事件. 重点是以下一组方法: - (void)touchesBegan:(NSSet *)to ...