序言
最近公司网络原因,导致我的常用编辑器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) |
以上都是个人理解如有不对之处还望指正交流!