前言
之前在培训机构学习的时候,老师说过没有必要再编辑工具上下太多的功夫。所以,一直以来都是用的老师给的压缩包。直到那一天我遇到了不让插U盘的公司、、、,配置环境,配置编辑器花了我一天的功夫,我可是谎称有两年工作经验的,当时觉得尴尬的雅痞啊。所以决定将sublime编辑器的常用插件整理出来。
package control
一般都是通过package control来安装的插件,但是得先有package control啊,很简单。Ctrl + Shift + p
,找到install package control
,按下回车,拿出手机,刷会儿微博,欧了。然后就可以通过package control
来安装插件了。需要注意的一点是,通过这种方式安装的插件的默认路径并不是安装路径,一般是C\Users\用户名\appData\Roaming\Sublime Text 3\Packages
。而我一般习惯于将其安装在sublime的安装路径中。解决的方法也是在网上找的,方法如下:关闭sublime,找到它的安装路径,然后新建一个Data文件夹,把C盘目录下的packages文件夹删掉。再重新打开sublime,Reference>Browser Packages 就会发现打开的文件夹就是我们新建的Data下的packages文件夹了。
Emmet
- 功能:编码快捷键
- 使用:教程
JSFormat
- 功能:JavaScript的代码格式化插件
- 用途:帮助我们将原始代码进行格式的整理,包括换行和缩进等等。
- 使用:右键选择JSFormat或者默认快捷键
Ctrl+Alt+F
,需要安装node环境
HTML/CSS/Js Prettify
LESS
- 功能:less高亮插件
- 使用:打开.less文件
less2css
- 功能:检测文件改动时,编译保存为.css文件
- 使用:打开.less文件,编译并保存时生成.css文件,需要安装node环境
Autoprefixer
- 功能:为css添加私有前缀
- 使用:
Ctrl + Shift + P
,选择Autoprefixer即可,需要node环境
Bracket Highlighter
- 功能:高亮标记,用于查看起始和结束标记,
{} [] () <tag></tag>
- 使用:点击对应代码即可
DocBlockr
- 功能:生成优美注释,包括函数名,参数,返回值等,并以多行显示
- 使用:建议先写函数,输入/* 或/** 回车
- 教程:教程
ColorPicker
- 功能:调色板,需要输入颜色时,可直接选区颜色
- 使用:
Ctrl + Shift + C
AutoFileName
- 功能:自动提示文件名
fileDiffs
- 功能:比较代码不同工具
- 使用:右键标签页,出现FileDiffs Menu 或 Diff With Tab...选择对应文件比较即可
Sublime Server
- 功能:用服务器打开文件
- 使用:
Tools > Sublimeserver > start Sublimeserver
右键view in SublimeServer
Terminal
- 功能:可以在当前文件夹下打开powershell
- 使用:在侧边栏文件夹下右击鼠标,找到
Open Terminal Here...
SidebarEnhancements
- 功能:右键多出了很多选择,比如创建文件时先写文件名,move Delete等
主题
- 功能:一个好看的主题会有一种让你爱上编码的冲动,每次打开编辑器都心情舒畅。
A File Icon
- 功能:给侧边栏的文件提供图标
- 使用:restart 编辑器,就是这么简单
Boxy Theme
- 功能:给出了大概四五种的主题,个人感觉还可以,
- 使用:
Perferences > theme...
,选择一种主题,我发现此时侧边栏发生了变化,但主编辑区并未发生变化。Perferences > Color Scheme...
,选择与之对应的主题,主编辑区就发生了变化。
后记
当然,sublime中好用的配置和插件应该远不止这些,以后遇到了再补充吧,以上这些应该可以实现开发的基本需求了。