前端开发工具(安装及常用技巧)——sublime text 3
安装
官方下载地址:http://www.sublimetext.com
Sublime Text 3 一大优势就是跨平台(Windows、Linux、OS X 都有);portable version 是便携版,免安装版的意思~
安装很方便直接下一步下一步就可以了...
中文补丁
补丁下载地址:http://pan.baidu.com/s/1bpFN7H1
1、下载的sublime text 3--汉化版.zip 文件解压,得到的Default.sublime-package 文件
2、打开sublime text 3,打开菜单->preferences->Browse Packages,进入到文件管理器:
3、返回上一层到sublime text 3 文件夹,打开“Installed Packages”文件夹。
4、粘贴汉化包文件“Default.sublime-package”到“Installed Packages”文件夹下面,无需刷新即可看到汉化效果。不够汉化不是很完整。
破解
1.打开sublime text 3,打开菜单->help->License信息,粘贴即可,提供2个注册码 (2016-4-13亲测可用),不行的话就去找别的。或者下载个注册机。
v3103可用
—– BEGIN LICENSE —– Ryan Clark Single User License EA7E-812479 2158A7DE B690A7A3 8EC04710 006A5EEB 34E77CA3 9C82C81F 0DB6371B 79704E6F 93F36655 B031503A 03257CCC 01B20F60 D304FA8D B1B4F0AF 8A76C7BA 0FA94D55 56D46BCE 5237A341 CD837F30 4D60772D 349B1179 A996F826 90CDB73C 24D41245 FD032C30 AD5E7241 4EAA66ED 167D91FB 55896B16 EA125C81 F550AF6B A6820916 —— END LICENSE ——
v3103以下可用
----- BEGIN LICENSE ----- Andrew Weber Single User License EA7E-855605 813A03DD 5E4AD9E6 6C0EEB94 BC99798F 942194A6 02396E98 E62C9979 4BB979FE 91424C9D A45400BF F6747D88 2FB88078 90F5CC94 1CDC92DC 8457107A F151657B 1D22E383 A997F016 42397640 33F41CFC E1D0AE85 A0BBD039 0E9C8D55 E1B89D5D 5CDB7036 E56DE1C0 EFCC0840 650CD3A6 B98FC99C 8FAC73EE D2B95564 DF450523 ------ END LICENSE ------
安装Package Control插件
官方网站:https://packagecontrol.io/
根据提示黏贴下面的代码,就可以自动完成安装(快捷键Ctrl+`)或者View(查看)>Show Console(显示面板)
安装主题
1、Crtl+Shift+P 打开命令面板,调出packager control 安装插件
2.查找你想要安装的主题网站可以看到效果回车直接安装:https://packagecontrol.io/browse/labels/theme
3、这边就看得到你安装的主题了
4、在用户设置这边修改主题
安装snippets 提高开发效率(js,jquery快捷提示代码功能)
插件advanceNewFile--快捷新建文件/目录
1.快捷键Crtl+Alt+N(注意默认新建的文件/目录都是在编辑器的第一个项目)
插件nettus fetch--快捷下载远端最近的插件/文件
1、设置远端文件地址+名称(Crtl+Shift+P >> Fetch:Manage)
2、新建文件然后,Fetch:file 下载文件代码
插件DocBlockr--快速添加注释
插件SummitLinter--js语法错误提示警告(nodejs范畴,还在学习中)
常用的快捷操作:
插入行后(Ctrl+Enter)插入行前(Ctrl+Shift+Enter)
光标在代码中间,快速的另取一行
选择整行(Ctrl+L)选择到单词(Ctrl+D)
插件TAG--快捷格式化代码,安装完成后 Ctrl+Alt+F
转到Goto(Ctrl+P)快速查找文件
1、输入当前项目中的文件名,快速搜索文件
2、输入@和关键字,查找文件中函数名
3、输入:和数字,跳转到文件中该行代码
4、输入#和关键字,查找变量名
选择到单词(Ctrl+D)+(Ctrl+K)配合选择多个单词集体修改,产生多行游标
栗子:选择1、2、4、5集体修改
ctrl+d选择,crtl+k跳过
复制整行到下一行(Crtl+Shift+D)
产生多行游标,全选选中的单词(Alt+F3)
在每行后面产生多行游标(全选>>Crtl+Shift+L>>箭头右)(Shiftl+鼠标右键-拖动)
设置文件编码格式(Crtl+Shift+P >> set syntax:)
命令模式关闭迷你地图(Crtl+Shift+p>> minimap)
Emmet插件快捷操作--生成html5头:!+Tab;html:5+Tab;!+(Crtl+E);html:5+(Crtl+E)
注意得在html编码格式下
Emmet插件快捷操作--快速生成标签并在标签内部添加内容:标签{内容}+Tab
格式化复制的代码:Crtl+shift+V
Elements快捷操作 文档地址:http://docs.emmet.io/
#page>div.logo+ul#navigation>li*5>a{Item $} <div id="page"> <div class="logo"></div> <ul id="navigation"> <li><a href="">Item 1</a></li> <li><a href="">Item 2</a></li> <li><a href="">Item 3</a></li> <li><a href="">Item 4</a></li> <li><a href="">Item 5</a></li> </ul> </div>
ul>li.item$@3*5 <ul> <li class="item3"></li> <li class="item4"></li> <li class="item5"></li> <li class="item6"></li> <li class="item7"></li> </ul>
ul>li.item$@-3*5 <ul> <li class="item7"></li> <li class="item6"></li> <li class="item5"></li> <li class="item4"></li> <li class="item3"></li> </ul>
计算数学表达式:ctrl+shift+y
<li>1*40</li>
//选中1*40 》ctrl+shift+y
<li>40</li>
前端切图小弟一枚,文中如果错误欢迎指出,小弟厦门工作,如有同行可以加个Q410232098,交流学习;
GitHub仓库地址:https://github.com/chenruifu/blog;欢迎给个Star
↓↓打个广告,个人运营的公众号:前端读者(fe_duzhe)
扫码关注,回复【前端视频】获取上百G前端教学视频