序言
最近公司网络原因，导致我的常用编辑器webstorm破解失败了（可能是因为我破解的方式不对），总之就是它下岗了。期间用过Hbuilder、VSCode等。各种原因后选择了sublime。废话不多说。下面分享我的摸索总结！
快捷键一览表：
| 快捷键 | 作用 | 备注 |
|---|---|---|
| ctrl + n | 新建编辑区 | |
| ctrl + shift + p | 打开命令行 | 常用于安装插件修改语法模式 |
| ctrl + p | 打开goto anything | #匹配页面 :跳转行数 /文件目录 |
| ctrl + f | 打开搜索栏 | |
| ctrl + shift + f | 按文件夹搜索 | |
| ctrl + enter | 当前行的下一行输入 | |
| ctrl + shift + enter | 当前行的上一行输入 | |
| ctrl + e | 补全标签 | 基于插件emmet |
| ctrl + [ / ctrl + ] | 减少/增加缩进 | |
| ctrl + d | 选中部分产生多行游标 | |
| ctrl + k | 跳过当前选中不产生游标 | 配合 ctrl + d来使用 |
| alt + F3 | 当前页面所有选中部分产生多行游标 | |
| ctrl +shift +v | 粘贴代码时可保留缩进格式 | |
| ctrl+h | replace功能 | |
| ctrl + shift +d | 快速复制当前行到下一行 | * |
下面我们来说一下编写html时的技巧：
输入ul>li*3按下ctrl+e可以得到
<ul>
<li></li>
<li></li>
<li></li>
</ul>
输入ul>.item$*3按下ctrl+e可以得到 //$表示序号
<ul>
<li class="item1"></li>
<li class="item2"></li>
<li class="item3"></li>
</ul>
输入 h2{this is content}按下ctrl+e可以得到 //{}的意思是需要输出的内容
<h2>this is content</h2>
插件的安装方法：
先安装Package Control；
使用Ctrl+`快捷键或者通过View->Show Console菜单打开命令行，粘贴如下代码：
import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read())
必备的插件推荐：
| 插件名 | 作用 | 备注 |
|---|---|---|
| emmet | 补全代码 | |
| theme-flatland/theme-spacegray | 主题（我喜欢的两个） | |
| javascript & nodejs snippet | 快速补全js代码插件） | 例如 gi 就是document.getElementById |
| theme-flatland/theme-spacegray | 主题（我喜欢的两个） | |
| view in brower或者sideBarEnhancements（推荐） | 浏览器打开html文件 | |
| DocBlockr | 帮助快速添加注释 | |
| httpRequest | 模拟http请求的插件 | 写入注释 输入ctrl + alt + R可以得到返回值 |
| sublimelinter-jshint | 对js语法进行校验 | （需要npm install –g jshint） |
以上都是个人理解如有不对之处还望指正交流！
网友评论