Sublime Text 3 简单介绍 及 实用插件 小技巧

1 篇文章 0 订阅
1 篇文章 0 订阅

1. 下载安装

Sublime Text 3 是非常实用的文本编辑器,可以通过 官方网站直接下载。 我用的是windows版本,快捷键和Mac的可能会有不同。
下载好st3后正常安装,安装OK后即可使用。
ST3是需要买license的,没有的话也可以使用, 未注册的st3暂时没有使用时间限制。

2. ST3界面 

sublime会自动保存上一次的编写内容,即使没有点击保存按钮,关闭窗口后再次打开可以看到上次编辑的内容

Sublime text 3 除了可以打开文本还可以打开图片。St3 会自动识别语言,高亮关键词

ST3的菜单栏里面有不同的操作,可以看到相对应的快捷键,对于常用的操作,记住快捷键对后续开发节省很多的时间

2.1 主题风格修改

preferences里面的settings user可以根据自己需要修改字号字体等信息

st3还提供了各种主题theme,可以在进入pci(本文第4部分)后输入theme即可看到各种theme的下载选项。由于我们在st3里面是看不到主题预览的,可以通过官网看到

Theme 网址:https://packagecontrol.io/browse/labels/theme

 

3. 实用技巧:

3.1 补全标签
在编写例如html文件的时候,手动输入各种标签是比较繁琐的,我们在输入了<html>后可以通过alt+">/." 这两个键自动补全</html>
3.2 Ctrl+shift+enter可以自动在tag里面编辑
3.3 保持格式复制粘贴代码
保持复制的代码原有格式,可以在粘贴的时候按住ctrl+shift+v
3.4 切换语法模式:

A. ST3右下角可以点击来选择语言

B. 启用命令模式,点击菜单栏的tools,选择command pallet (或者快捷键ctrl+shift+p)  ,输入set syntax加目标语言就可以切换了。如输入set syntax python就可以直接切换到python了,因为sublime text3是模糊匹配的,直接输入syntax python甚至ss python也可以看到选项。所以其实在输入命令的时候我们可以偷懒用更少的输入来获取结果 
 
3.5 Goto anthing: 快速找到某个文件
可以在goto anything下输入文件名即可直接定位(goto anything的快捷键是ctrl + p),在输入的时候如果我们通过上下选择,可以看到sublime text 3还帮我们自动预览了文件,非常的方便。 如果文件名在多个文件夹下都有,我们还可以通过输入文件夹/文件名的方式更好来匹配查询结果。
在css文件下如果我们想迅速找到某一个元素,输入@元素名 上下选择结果可以找到。找到了我们想要编辑的元素,在输入框里可以通过驼峰写法来更快写代码,如输入bgc会跳出background-color的选项。
 
3.6 查找替换
可以通过 1. ctrl+h来将匹配的内容替换成目标内容; 2. 选中一个想要替换的内容,输入ctrl+d,可以加入其他同名的想要修改的关键词,看到每个选中的关键词后面都多了闪烁的光标,这时候我们可以同时对所有选中的词进行批量修改。
如果我们并不想所有相同项都选中,可以在ctrl + d已选中的情况下输入ctrl + k来跳过选项,然后ctrl+d去选中下一匹配项 。
eg,在写一个switch语句的时候有多个case语句后没有加break; 我们可以通过多行游标选中,然后批量添加"break;" 这一行
 
3.7 Ctrl+shif+d: 快速复制当前行的文本
3.8 多行游标
选中文本内容,按住alt+F3, 可以选中所有匹配文本内容
先ctrl+a,再ctrl+shift+l可以看到选中的每一行后面都出现了游标

使用鼠标拖动,按住shift,使用鼠标右键拖动,可以看到产生多行游标 

3.8 命令模式查找

通过命令模式我们还可以去查找不知道功能,例如右上角的minimap如果我们想要隐藏的话,在命令模式下输入minimap可以看到有一个view:toggle minimap的选项,点击之后发现minimap被隐藏了

 

4. 通过package control来安装管理插件 

st3里面的插件都是通过package control(pci)来管理的。我们可以ctrl+shift+p进入命令板(也可以点击tools-command pallet),输入package control install (pci)来安装pacakge。

安装不成功的话可以参考这个中文教程官方英文教程  

安装OK后,我们就可以通过进入pci来安装各种插件了 

4.1. Emmet插件 
Emmet插件(通过pci直接安装,如果不OK可以参考上一小节提到的中文教程)装好后,我们新建空白html文件,输入"!"然后按下ctrl+e, 就可以直接自动生一个html文档的标记 
在编辑的时候我们可以通过在goto anything下输入“#”加上目标元素就可以直接定位到目标元素了。Ctrl+enter可以在光标下新建一行进行编辑。

新建一个class="item"的含有x个<li></li>的<ul></ul>, 我们
可以在emmet下输入ul>.item$*x然后按ctrl+e回车,一次性我们就可以生成10个<li></li>
生成好后,我们可以通过选中目标,按ctrl+"}/]"回车来增加缩进 (左括号是减少缩进), 批量进行操作。 

4.2. AdvancedNewFile 插件
创建保存文件-除了通过ctrl+n和save as,我们还可以通过AdvancedNewFile来新建。进入pci安装好插件后重启ST3,我们可以按住ctrl+alt+n来新建文件,直接输入比如/files/newJS/test.js来新建文件(指定文件的路径,甚至可以再新建路径新建文件)。 
 
4.3. nettuts + fetch 
可以帮我们获取更新最新版本的插件

4.4. sidebarEnhancements 
侧边栏加强工具,比如我们可以直接右击html文件在浏览器查看 
 
4.5. DocBlockr插件  
可以帮我们很快的添加注释,安装好后在编辑块输入"/*"然后回车,可以自动补全注释。在一个function上方输入"/**"然后按tab键回车,可以自动补全一个注释格式
 


 
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值