您的位置: 首页 >日志>前端技术>详细内容

前端技术

SublimeText2使用备忘

来源:本站原创 发布时间:2012-09-03 17:42:37 浏览次数: 【字体:

 

便携版Sublime text

1. 在软件根目录下建立一个  Data  文件夹。

2. 如果之前有运行过程序,在  C:Users[系统用户名]AppDataRoaming  目录下会有一个  Sublime Text 2  的文件夹,将里面的内容剪贴到刚刚建立的  Data  文件夹内,并删除该  Sublime Text 2  文件夹 ,如果在此之前没有运行过程序,则不用作任何处理,插件、配置文件会默认生成到程序目录下的  Data  文件夹中。

 

 

 

插件

1. Package Control组件 (可以理解为这是一个在Sublime text内“管理插件的插件”)

    1)按Ctrl+`调出console

    2)粘贴以下代码到底部命令行并回车:

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(''+pf.replace(' ','%20')).read())

    3)重启Sublime Text 2

    4)如果在Perferences->package settings中看到package control这一项,则安装成功。

    如果这种方法不能安装成功,可以到这里下载文件手动安装。

 

    安装完 Package Control 组件后,用ctrl+shift+p调出系统命令面板,输入 install 就可以找到 install package 命令,打开之后会在线获取插件列表,可以通过插件名称进行搜索安装。

 

【常用插件推荐】(可以通过在Package Control内搜索插件名称进行安装)

    1. Zen Coding

        通过一种类似css选择器的语法方式,快速书写html代码的一种编码方式,详细说明可以问一下度娘,或参考 《Zen Coding: 一种快速编写HTML/CSS代码的方法》 ,总之谁用谁知道。

        在代码编写过程中通过tab键激活,如:输入“div”后,点击tab键,会自动替换成“

”,或者可以使用ctrl+alt+enter,在下方代码输入框内输入,输入过程中上方代码正文会相应的改变,实时预览,比如我们可以这样……:

 

    2. jQuery

        jQuery 代码提示。

 

    3. JS Format

        格式化JS代码,对于一些压缩过或者缩进乱套的js代码可以直接在编辑器内进行格式化。

    

    4. Alignment

        代码对齐插件,对于js的各种长度的变量要对齐才舒服的人来说简直就是一种解放,选中各个变量之后按下相应的快捷键即可,它会自动帮你补全位置,上下对齐……

        

 

    5. Clipboard History

        剪贴板历史记录插件,剪贴或者复制过的文本不怕丢失,默认 ctrl+alt+v 打开面板。

 

    6. Bracket Highlighter

        如果感觉默认的括号、代码匹配高亮不够“亮”的话,可以使用这个插件。

 

    7. SideBarEnhancements

        增加侧栏(ctrl+kb调出,按住ctrl后按k再按b)右键菜单选项。

 

HtmlTidy

PHPTidy

CSSTidy

ctrl+shift+p    theme - **

 

 

代码片段

点击菜单 “Tools->New Snippet(新代码段) ”

    

 

会自动给出一个代码片段模板

我们可以先把它修改成:

 

 

content 标签包含的是代码片段的正文内容。其中${1:this} 是表示产生代码片段后,光标默认停在这个位置,并且会自动选中"this"这个单词。

${2:snippet}表示,产生代码片段后,按tab健光标跳到 snippet 位置,并且会自动选中"snippet"这个单词,以此类推。

 

tabTrigger 标签表示触发这个代码片段的快捷代码,比如上面代码hello:输入hello然后按tab键即可显示content标签的内容。

 

scope 标签表示这个代码片段在哪种格式文件下生效。

 

设置完成后点击保存,在“packages/User”目录下,可以根据不同类型建立文件夹存放。

 

 

【演示】

1. 输入“hello”

2. 点击tab

3. 再次点击tab

 

 

 

快捷键:

 

Ctrl+L 选择整行(按住-继续选择下行)
Ctrl+KK 从光标处删除至行尾
Ctrl+Shift+K 删除整行
Ctrl+Shift+D 复制光标所在整行,插入在该行之前
Ctrl+J 合并行(已选择需要合并的多行时)
Ctrl+KU 改为大写
Ctrl+KL 改为小写
Ctrl+D 选词(按住-继续选择下个相同的字符串)
Ctrl+M 光标移动至括号内开始或结束的位置
Ctrl+Shift+M 选择括号内的内容(按住-继续选择父括号)
Ctrl+/ 注释整行(如已选择内容,同“Ctrl+Shift+/”效果)
Ctrl+Shift+/ 注释已选择内容
Ctrl+Space 自动完成(win与系统快捷键冲突,需修改)
Ctrl+Z 撤销
Ctrl+Y 恢复撤销
Ctrl+Shift+V 粘贴并自动缩进(其它兄弟写的,实测win系统自动缩进无效)
Ctrl+M 光标跳至对应的括号
Alt+. 闭合当前标签
Ctrl+Shift+A 选择光标位置父标签对儿
Ctrl+Shift+[ 折叠代码
Ctrl+Shift+] 展开代码
Ctrl+KT 折叠属性
Ctrl+K0 展开所有
Ctrl+U 软撤销
Ctrl+T 词互换
Ctrl+Enter 插入行后
Ctrl+Shift Enter 插入行前
Ctrl+K Backspace 从光标处删除至行首
Ctrl+Shift+UP 与上行互换
Ctrl+Shift+DOWN 与下行互换
Shift+Tab 去除缩进
Tab 缩进
F9 行排序(按a-z)
×

用户登录