Sublime Text 2中前端必备的常用插件
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插件用法请自行百度。
大名鼎鼎的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>
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中前端必备的常用插件的更多相关文章
- Sublime Text 2/3安装使用及常用插件
一.介绍 Sublime Text 是一款较新的编辑器,它轻量.简洁.高效,良好的扩展性以及跨平台等特性,使得越来越多的开发人员喜爱.它是一款收费的商业软件,但可以免费无限制无限期的试用,只会偶尔提醒 ...
- Sublime Text 3安装与使用 Package Control 插件安装
原文地址:http://www.cnblogs.com/zhcncn/p/4113589.html 本文是Sublime Text 全程指引 by Lucida (http://www.cnblogs ...
- sublime text 3中emmet常用技巧
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Sublime Text 使用指南 - 前端开发神器
Sublime Text 前端开发的神器 Sublime Text是一个前端开发者必备的编辑器,大量的插件,完善的功能,优越的性能,有非常多的特色,给前端开发提供了一个完善的开发条件. 本文主要介绍的 ...
- 在 Sublime Text 2 中使用 SFTP 插件快速编辑远程服务器文件
在 Sublime Text 2 中使用 SFTP 插件快速编辑远程服务器文件 开源程序 浏览:29555 2013年05月02日 文章目录[隐藏] 常见的工作流程 SFTP 安装和使用方法 第一步: ...
- Sublime Text 2中自定义代码模板
Sublime Text 2中自定义代码模板 2012-12-06 10:13 9921人阅读 评论(0) 收藏 举报 分类: 编辑器-Sublime Text 2(5) 版权声明:本文为博主原创 ...
- 在sublime text 3中设置浏览器预览快捷键
1.安装 SideBarEnhancements ctrl+shift+p,进入命令模式,然后输入package control(或者直接输 pci 或许也行),回车: 输入:SideBarEnhan ...
- 在Sublime Text 3 中安装SublimeLinter,Node.js进行JS&CSS代码校验
转载自:http://www.wiibil.com/website/sublimelinter-jshint-csslint.html 在Sublime Text中安装SublimeLinter,No ...
- Sublime text 3 中Package Control 的安装与使用方法和解决Sublime Text 3不能正确显示中文的问题
Sublime text 3 中Package Control 的安装与使用方法,英文好可以在这个网址看看, 下面简单的说明一下 : https://packagecontrol.io/install ...
随机推荐
- hdoj 2401 Baskets of Gold Coins
Baskets of Gold Coins Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Ot ...
- PyDev+eclipse的编码问题
1.在代码的开始声明编码为utf-8
- apache启动目录(禁止目录)与设置默认入口文件的方法
设置默认入口文件的方法: 打开apache的conf目录,找到httpd.conf文件,打开这个文件,搜索dir_module,找到以下截图修改位置进行修改,注意重启apache服务器,修改位置才会生 ...
- 基于Unity3D的AOP使用思路
考虑到AOP的特性,并参考Python的装饰模式(AOP类似),在做开发时,可以使用AOP的思想做一些工作上的简化(比如:运行时的Range属性.内存/存档加密属性等等). 但是AOP(使用的Post ...
- .jar是什么文件?(转载)
JAR(Java ARchive,Java 归档)是一种与平台无关的文件格式,可将多个文件合成一个文件.用户可将多个 Java applet 及其所需组件(.class 文件.图像和声音)绑定到 JA ...
- 安卓开发中Theme.AppCompat.Light的解决方法
styles.xml中<style name="AppBaseTheme" parent="Theme.AppCompat.Light">提示如下错 ...
- jquerymobile-可折叠内容(Collapsible content)
可能我们在开发中遇到过这样的问题,我们只是看到一个题目或者简单的介绍,然后一点击会在下面展开对应的详细的内容.在jqm中实现这个效果很简单.下面给出一段例子代码: <!DOCTYPE html& ...
- Android中应用程序如何获得系统签名权限
有些库的使用条件比较苛刻,要求同一签名的程序才可以获得访问权.此时即便是在AndroidManifest.xml中添加了相应的permission,依旧会得到没有xx访问权限的问题.比如android ...
- 最简单的自定义适配器adapter
下面是一个非常简单的自定义适配器的总体源码,从这个源码入门,就可以慢慢学会适配器了 适配器的作用: 完成数据和界面控件的绑定,把数据绑定到界面的现实控件条目上(对于listView,应该是listVi ...
- Day01 - Python 基础介绍
1 Python 简介 1.1 Python 的由来 Python的创始人:吉多·范罗苏姆(Guido van Rossum) 1989年,吉多·范罗苏姆为了在阿姆斯特丹打发圣诞节假期时间,开发的一个 ...