前端开发利器 Sublime Text 3 使用技巧和总结笔记

发表于   |   分类于   |  

sublime

这篇文章是本人使用 Sublime Text 进行前端开发过程中的一个自我总结，思路也许不是很清晰，不过还是希望对你有所帮助，千万别把这边文章收藏起来发霉，背快捷键，还不如多实际操作几次记得深刻。

  1. 目前官方版正式版 Sublime Text 2 Build 2221，而 Sublime Text 3 为测试阶段，建议下载正式版 注册机SublimeTextKeygen下载
  2. 打开注册机，先点中间 “Patch key” 打开 “sublime_text.exe” 文件确认，再随意修改下 “Name” 然后 “Generate”，复制好里面的 License。（注：请按步骤做，否则不成功！此时请不要关掉注册机，不要辅助虚线部分文字~）
  3. 打开 Sublime Text 2，到 Help–Enter license 粘贴点击确认，完成~
  4. 如果手头银子充足，请支持正版软件，不过 sublimetext 售价不便宜，USD $70~
  5. 2017年9月13日 Sublime Text 3 3143 正式版已发布。 标志着Sublime text正式进入3.0版本，先感谢作者的更新！

  6. 分享最新版 Sublime text 3 3143 注册码，license key 仅限测试体验，请大家支持作者，购买正版！

    —– BEGIN LICENSE —–
    TwitterInc
    200 User License
    EA7E-890007
    1D77F72E 390CDD93 4DCBA022 FAF60790
    61AA12C0 A37081C5 D0316412 4584D136
    94D7F7D4 95BC8C1C 527DA828 560BB037
    D1EDDD8C AE7B379F 50C9D69D B35179EF
    2FE898C4 8E4277A8 555CE714 E1FB0E43
    D5D52613 C3D12E98 BC49967F 7652EED2
    9D2D2E61 67610860 6D338B72 5CF95C69
    E36B85CC 84991F19 7575D828 470A92AB
    —— END LICENSE ——

Sublime Text 3 使用快捷键

  1. Ctrl+Alt+f 可以整理JS代码的格式，需要选中后使用。（需插件支持：format）
  2. Ctrl+Ait+p 调出强大的命令面板。
  3. Ctrl+P 快捷功能-
  4. Ctrl+R 调出 @ 功能 可以迅速定位 function 函数名称
  5. Ctrl+G 调出 ：功能可以迅速定位行号，调试修改样式的时候常用。
  6. Ctrl+~ 调出控制带
  7. Ctrl+D和Alt+F3前者“连续按住可以选择向下选择相同字符串”，后者“自定义选择文本，按下就可以一次性选择所有相同文本”。
  8. Ctrl+/ 注释整行。 Ctrl+Shift+/ 注释选择的部分。
  9. 更多快捷键请查看以下图片！

Sublime Text 3 使用技巧效率

  1. 鼠标选中多行，按下 Ctrl+Shift+L (Command+Shift+L) 即可同时编辑这些行；
  2. 鼠标选中文本，反复按 CTRL+D (Command+D) 即可继续向下同时选中下一个相同的文本进行同时编辑；
  3. 鼠标选中文本，按下 Alt+F3 (Win) 或 Ctrl+Command+G(Mac) 即可一次性选择全部的相同文本进行同时编辑；
  4. Shift+鼠标右键 (Win) 或 Option+鼠标左键 (Mac) 或使用鼠标中键可以用鼠标进行竖向多行选择；
  5. Ctrl+鼠标左键(Win) 或 Command+鼠标左键(Mac) 可以手动选择同时要编辑的多处文本

sublime text 3 主题美化

  • 皮肤的切换标签换成直角的，不喜欢默认的圆润，这套皮肤的名字叫：Theme - Nil，当时看了木木木木木博客的一篇文章（突然发现我跟他的审美观如此匹配~）
  • 代码的配色方案，Color schemes for hackers – Base16 地址：https://github.com/chriskempson/base16
  • 另外一套主题：spacegray，项目地址：http://kkga.github.io/spacegray/，这套主题集成了base16配色方案，也是现在我用的主题，界面预览请看本篇文章的首图

sublime text 3 插件技巧

  1. sublime text 插件删除步骤：“Ctrl+Shift+P”—“Remove Package”—“找到需要删除的插件，并点击即可删除”
  2. 解决GBK和GB2312乱码问题：安装插件 “ConvertToUTF8”
  3. 更多资料：Sublime Text 2 - 性感无比的代码编辑器！程序员必备神器！跨平台支持Win/Mac/Linux

sublime text 3 常用插件

  1. package Control：这是为了方便管理插件的一个工具，所以最好就是先装这个插件了，使用快捷键Ctrl+Shift+P 调用，官方地址：https://packagecontrol.io/
  2. YUI Compressor：压缩JS和CSS文件，按F7键后，若压缩当前文件（demo.js），则压缩后的文件（demo.min.js）保存在该文件的同级目录，需要安装java的JDK。使用方法：sublime text 插件：YUI Compressor
  3. JsFormat：有压缩当让也可以格式化，这个就是格式化JS用的，快捷键Ctrl+Alt+F。
  4. ConvertToUTF8：Sublime 只支持utf8编码，该插件可以显示与编辑多种非utf8编码的文件
  5. Emmet：也就是大名鼎鼎的 ZenCoding ，新版把名字更改为“蚂蚁”的英文单词Emmet，这可是前端开发的超级利器，可以超快速编写HTML/CSS/JS，当然这个插件还支持多种编译环境，如常见的：Eclipse/Aptana、Coda、Notepad++、Adobe Dreamweaver、TextMate等，使用方法：Emmet官方网站
  6. jQuery和CSS3：前端开发必备。
  7. Clipboard History：剪切板历史，仅支持Sublime Text 2
  8. BracketHighlighter:高亮显示匹配的括号、引号和标签等，甚至是自定义的标签，当看到密密麻麻的代码分不清标签之间包容嵌套的关系时，这款插件就能很好地帮你理清楚代码结构，快速定位括号，引号和标签内的范围，当然它也是前端必备。
  9. CSScomb：它可以按照一定的 CSS 属性排序规则，将杂乱无章的 CSS 属性进行重新排序。选中要排序的 CSS 代码，按 Ctrl+Shift+C，即可对 CSS 属性重新排序了，代码从此简洁有序易维护，如果不款选代码则插件将排序文件中所有的 CSS 属性。当然，可以自己自定义 CSS 属性排序规则，打开插件目录里的 CSScomb.sublime-settings 文件，更改里面的 CSS 属性顺序就行了。因为这个插件使用 PHP 写的，要使他工作需要在环境变量中添加 PHP 的路径，具体请看 CSScomb官方网站 的说明。下载地址：https://github.com/csscomb/CSScomb-for-Sublime
  10. alignmentSublime集成的代码格式化插件，可以代替JsFormat、CSS Format 部分功能。

常用插件列表更新于 2014年10月1日

坚持原创技术分享，您的支持将鼓励我继续创作！