为了账号安全,请及时绑定邮箱和手机立即绑定

看“ 前端开发工具技巧介绍—Sublime篇” 小结

标签:
前端工具

一、快捷键:(Ctrl 用 Ct 表示,Shift 用 Sh 表示)<br>
Ct+Sh+P:启动命令模式,常用于安装新插件时使用,与Pci(缩写)配合使用<br>
Ct+P:出现查找框时,输入 @和要查找的内容<br>
Ct+Sh+D:复制
Ct+N:建文档

闭合标签方法:
(1)Alt+键盘中显示 > 的键
(2)Edit->Tag->Close Tag

修改多行的方法:<br>
(1)Ct+Sh+L:先选择多行,再按Ct+Sh+L,则可同时输入
(2)Ct+A:选择全部内容<br>
(3)Ct+D:选某个变量或语句,如:as,再选下一个 as,选第三个 as 时文档中全部的 as 将都被选中(Sublime Text3有此功能,Sublime Text 2只能一个一个地按过去);若要跳过某个 as 时,可用 Ct+K,也可连续跳过多个;<br>
(4)Alt+F3:先选中文档中某一个词,再按Alt+F3,则文档中该词全被选中<br>
(5)Sh+鼠标右键,再竖直向下或向上拉动:可多行同时输入

安装Packet的配置信息:
(1)text2版
import urllib2,os,hashlib; h = '2915d1851351e5ee549c20394736b442' + '8bc59f460fa1548d1514676163dafc88'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler()) ); by = urllib2.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); open( os.path.join( ipp, pf), 'wb' ).write(by) if dh == h else None; print('Error validating download (got %s instead of %s), please try manual install' % (dh, h) if dh != h else 'Please restart Sublime Text to finish installation')

(2)text3版
import urllib.request,os,hashlib; h = '2915d1851351e5ee549c20394736b442' + '8bc59f460fa1548d1514676163dafc88'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

二、一些插件及与其相关的快捷键的使用:
(1)Emmet插件:
安装Packet:菜单栏View->Show Console->粘贴text2或text3的Packet配置信息->重启软件->Ct+N(新建文档)->Ct+Sh+P->输入pci->查找要安装的插件,如emmet
安装好Emmet插件后:
!+Ct+E:迅速生成html的基础元素

Ct+P:查找时加 #元素名;找到后,若要在该行下新加一行,可按 Ct+Enter

在文档中写: ul>.item$10 ,再按Ct+E,则一次性生成10个<li class="item(1/2/3/../10)"></li> 即 父元素> .(表示有class标签或用 # 表示有id值)类名(id名)$(子元素出现次数),再Ct+E

在文本中写 h2{this is good} 再按Ct+E,则生成 <h2>this is good</h2>

Ct+ 键盘上含 } 的键:文本缩进

Ct+Sh+V:粘贴时保持复制时的格式,如缩进等

(2)insert callback插件
Alt+C:删除多余的符号

(3)advanNew
用于创建文档的同时命名、保存该文档
Ct+Alt+N:在不用打开相关文件夹的情况下新建文档,需填写路径到 文档名.html(或其他类型文档)

(4)httpRequester
用于测试地址
Alt+Ct+R:测试 localhost(:端口号)/...

(5)netauke Snip
1,下载插件 nettus fetch
2,命令行:
管理 fetch:Manage(可配置需要的)
3,如何用fetch 快速下载JQuery
1)Ctrl+Alt+N 在public/js/jquery.js 创建文件
2)在文件中,Ctrl+Shift+P fetch File JQuery下载

安装Nettuts+ Fetch (https://packagecontrol.io/packages/Nettuts%2B%20Fetch)
通过这个插件能方便的更新前端开发所需的一些组件类库。
命令模式下,打开Fetch:Manager,看到现有的组件类库配置信息.

alt+command+N 创建 public/js/jquery.js文件,Tools->Command Palette… (shift+command+P) 打开命令模式, 打开Fetch:File,看到Jquery回车就能下载最新版本的Jquery类库.

增加组件
在Fetch:Manager的配置文件中,在Jquery路径后添加逗号,下面添 加:"underscore":"https://github.com/jashkenas/underscore/blob/master /underscore-min.js",保存文件,alt+command+N 创建 public/js/underscore.js文件,打开Fetch:File,选择underscore回车就能下载最新版本的underscore 类库.
(6)sidebar enhancement
右击对应文档,有直接浏览该页的选项

(7)docblockr
用于简化注释拼写
/ +Tab键 :可有函数的注释格式
/
或 /* + 回车键:其余注释符自动补充

(8)sublimelinter-jshlint
用于语法、风格的检验
安装jsnode插件 -> 安装sublimelinter-jshlint插件 ->运行cmd,输入 npm install -g jshint ->最后到sulimt软件里检验

点击查看更多内容
35人点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消