关于sublime text 3(3103)版本Ctrl+Alt+P无法正常使用解决办法

关于sublime text 3(3103)版本Ctrl+Alt+P无法正常使用,自定义快捷键的设置command实际上就是prompt_select_workspace,解决了此问题

过完年回来上班的第一天,打开sublime text 3,提示有更新(Sublime Text 3 Build 3103),没有多想就点下载更新了…更新完后,发现问题严重了,一方面是之前朋友买的key失效了,看到非注册的几个单词在窗口顶部就不自在了.当然这个不是本文重点,至于怎么解决这个问题,我相信不会难倒机智的大家.

而另一方面是很多之前的设置也没了.比如自定义快捷键.我有安装SideBarEnhancements这个插件,设置的F12快速预览也没了,只好找回旧版存档重新设置,其实这个问题也不大.
最糟糕的是,之前习惯用的快速切换项目的Ctrl+Alt+P不能用了,这个是旧版默认设置好的.然后到处找快捷键怎么设置的,我很傻,其实后来发现这个问题很好解决.我却绕了个大弯.

首先,百度肯定是搜不到的.然后去用谷歌找.谷歌是万能的,找到如下内容:

{ "keys": ["ctrl+alt+p"], "command": "prompt_select_workspace" }

这下添加到自定义keymap,问题解决.参考:Quick Switch Project shortcut doesn’t work anymore(当然,他好像说3098版本就去掉了,我并未注意到可能我一直在使用更旧的版本.而changelog里面似乎也没看到3098)

当然这里还要提一点的是,如果一切设置好了发现还是不能用,那多半是快捷键冲突所致,比如输入法的全局快捷键等等,这里推荐一个虽然有点老,但是还不错的工具Windows Hotkey Explorer,大家自行安装后,可以查看系统全局被占用的快捷键,然后对应的关闭调整一下就好了.

windowsHotkeyExplorer软件界面
windowsHotkeyExplorer软件界面

总结下来我的自定义快捷键是这样的.

[
    { "keys": ["f12"],
        "command": "side_bar_open_in_browser" ,
        "args":{"paths":[], "type":"testing", "browser":""}
    },
    { "keys": ["alt+f12"],
        "command": "side_bar_open_in_browser",
        "args":{"paths":[], "type":"production", "browser":""}
    },
    {
        "keys": ["ctrl+t"],
        "command": "side_bar_new_file2"
    },
    {
        "keys": ["ctrl+alt+p"],
        "command": "prompt_select_workspace"
    }
]

最后来说说为啥我笨死了.其实关于这个command,我找不到的话,我直接找旧版本的sublime text的default keymap查一下就好了嘛…笨笨笨………..还费了老大功夫.其他朋友有遇到类似问题也可举一反三,自行配置一个好用的sublime text咯~~~~

工具虽好,务必不要再WIN10下使用该软件,会发生十分可怕的事情!(2017年8月25日 更新)

SublimeText3的css文件引用图片转base64快速方法

如果在SublimeText3的css文件引用图片里将图片快速转换为base64(Data URL)的方法,以及利用chrome开发者工具获取图片的Data Url的方法

在你做的css文件中,起初背景图都是直接引用目录的切好的图片.如下:

.icons {background-image:url(../images/icon.png);}

那么在做移动端页面的时候,有时我们需要将小图直接转换成base64格式,一般只能借助第三方工具.
这里其实用sublime text 3 的快捷键ctrl+’可以直接快速转换.
当然页面的图片建议是压缩(例如tinypng工具)后的,要不然转换出的字符将会很长.
如果能确定页面的图片都可以直接转换,你可以直接选择 url( 然后快捷键 alt+f3 ,接着按 ctrl+’ ,这样一来css的图片就全部转换好了.

另外还有一种通过chrome快速获取网页上图片的Data Url方法.如图

chrome_ImageToDataUrl
chrome_ImageToDataUrl

SublimeText3突然无法通过快捷键F12预览页面

最近我的sublime text 3突然无法用F12预览正在制作的页面了.相反,倒是成了提示” unable to find xxx”,还真是奇怪,当然本身这是用的一个侧边栏插件Side​Bar​Enhancements,但是好好的插件,为什么无缘无故的快捷键就坏了呢.

最近我的sublime text 3突然无法用F12预览正在制作的页面了.相反,倒是成了提示” unable to find xxx”,还真是奇怪,当然本身这是用的一个侧边栏插件Side​Bar​Enhancements,但是好好的插件,为什么无缘无故的快捷键就坏了呢.不过最近似乎每次启动sublime text的时候,都有更新什么插件,于是就想到本来已装的插件SideBarEnhancements的设置,可是初看又看不出来什么名堂.于是只好去看看是不是插件更新了什么.

找到插件主页,看到了大大的F12 key的说明片段:

(Please note that from version 2.122104 this package no longers provides the key , you need to manually add it to your sublime-keymap file (see next section))

这句话说的很清楚了.但是我就想作为全局使用的快捷键,毕竟养成的习惯不易更改嘛…继续向下看,找到F12 key conflict, 官方也有说明啦:

On Sublime Text 3 F12 key is bound to "goto_definition" command by default. This package was conflicting with that key, this no longers happens. You need to manually add the keys now: Go to Preferences -> Package Settings -> Side Bar -> Key Bindings - User and add any of the following:

[
    { "keys": ["f12"],
    "command": "side_bar_open_in_browser" ,
    "args":{"paths":[], "type":"testing", "browser":""}
    },
    { "keys": ["alt+f12"],
    "command": "side_bar_open_in_browser",
    "args":{"paths":[], "type":"production", "browser":""}
    },
    {
    "keys": ["ctrl+t"],
    "command": "side_bar_new_file2"
    },
    {
    "keys": ["f2"],
    "command": "side_bar_rename"
    },
]

其实很简单,将上面内容复制到

SideBarEnhancements_keybindings_user
用户自定义键位绑定

保存就行了,如果想要鱼和熊掌兼得的朋友,就请自行设置成其他快捷键咯.

另外奉献两个参考地址:

Side​Bar​Enhancements

Sublime 3 – Set Key map for function Goto Definition

PS: 注意官方提供的修改方案,设置了F2的快捷键,覆盖了之前的定位功能,如果不需要这个重命名文件功能请自行删除(2014年11月28日)

关于Emmet自带的全部snippets简单介绍

用sublime text的同学少不了会安装emmet插件.其实上手简单,但是很多技巧还是需要一些时间来研究的,这次我找到了emmet插件内的snippets.json文件,一般是位于..\(目录路径)\Sublime Text 3\Data\Packages\Emmet\emmet(这里使用的是sublime text 3),如果未找到,也可以将..\Data\Installed Packages\Emmet.sublime-package文件解压出来(我直接用7-zip解压,winRAR未测试),解压后找到..\Emmet\emmet\内的snippets.json打开一样可以查看…

为了方便大家查看我将该文件的内容在文章结尾处会贴出来.

因为是简单介绍,我就对其中某些特性说明.大家都知道emmet可以自动补全代码,例如在css文件中的{}内,我想输入position:relative;,我只需要输入por,他会自动提示想要的结果,我们直接按tab或是enter,就会自动出来,这个特性就不用说太多了,但是有时候,会因为输错,而无法高效的编写代码,所以,我们需要熟悉究竟最佳的缩写方式是什么,看这个文件就一目了然了.

为什么有时候无法提示出我们想要的代码?有可能是因为,他未能识别当前文件的语法条件.snippets.json同样写得很清楚,在css环境下,其中很多复杂的css3写法可以轻松输出,例如输入animtfc,他会自动补全很多不同兼容性的CSS3代码,十分方便,大家就自行测试了.

(最近找的EMMET速查手册干货放在前面既要醒目又要低调见Emmet Documentation cheat-sheet,更新日期:2015-06-05强行插入正文: )

继续阅读“关于Emmet自带的全部snippets简单介绍”

Sublime Text 3常用用户自定义配置推荐

现在可算是对sublime text编辑器有点入门了,除了基本操作快捷键之外,对于sublime text的用户配置设置我今天也细细研究了一番,对于英语勉强说得过去的我,看这个默认的配置(Preferences.sublime-settings—Default)说明是没有太大压力的,对于英语差的,先硬着头皮看看,实在不行,我总结了以下一些我感觉还算比较方便的配置选项,当然,自定义的就是覆盖了默认设置的,有兴趣的可以看看,根据个人需要修改…首先当然是开启Preferences.sublime-settings—User了,见图,我在配置中加了说明方便查阅:

Sublime text 3用户自定义设置配置
Sublime text 3用户自定义设置配置

(图中可以看到修改过的文件名称是黄色,选中的那一行也高亮了等等,大家自行观察咯~)

接下来大家根据需要拷贝过去进行修改吧…

{
"auto_complete_selector": "source,text", //用到snippet的话加此行,否则请无视我
"font_size": 16, //不用多说,字体大小,同样可以按住CTRL+'+'或者'-'或者'鼠标滚轮'调整
"ignored_packages":
[
"Vintage"
], //忽视此包...
"word_separators": "./\\()\"':,.;<>~!@#$%^&*|+=[]{}`~?", //这些字符会在鼠标双击时隔断,可自行删除不必要的,例如这个被我修改过删除了'-'符号,详情可参考我之前写的<<sublime text快速选择带有横线(连接符)的类名或ID名等>>,上一篇就是了
"word_wrap": true, //一行内容太长了,自动换行(如果你够'自信'的话,又喜欢拖动X轴滚动条请无视我)
"highlight_line": true, //高亮显示当前编辑的行,有时自动折行看不清,这个就把一整块显示出来,清晰一些
"show_encoding": true, //编辑器底部显示编码信息,用GBK编码的偶尔出现乱码,看看这个能查一下,虽然作用不大,放在下面也不占地方,无所谓了
"save_on_focus_lost": true, //当焦点从当前编辑文档中丢失,会自动保存,看个人喜好咯
"highlight_modified_tabs": true, //高亮TAB显示被修改过的文档,如果上一条为关闭,修改过的文件看起来更清晰
"draw_minimap_border": true, //在编辑器右侧小代码地图上为当前区加个边框,视力不好可以加上,比如我
"always_show_minimap_viewport": true, //总是显示这个迷你地图窗口,还是视力不好
"show_tab_close_buttons": false //不显示TAB标签上的关闭图标(个人认为没用,文件多了不小心切换的时候关了更麻烦,真的需要关闭某个标签的时候,可以在左侧栏已打开的文件中点叉叉,当然个人更加推荐使用快捷键CTRL+W)
//注释 BY WHIDY 2014年5月15日...
}

PS: 经过几日测试,我发现焦点失去自动保存功能并不好用,大家看情况来使用吧,原因:从外部快速切换到sublime text时,代码块会滚动一下,影响查找刚才编辑的位置,另外,如果是GBK编码格式,有时不小心乱码了,比较麻烦(2014年5月21日)

sublime text快速选择带有横线(连接符)的类名或ID名等

其实sublime text的设置中有很多小秘密,例如本文介绍的,通过修改其中的一个配置,就可以实现直接鼠标双击或者快捷键CTRL+D,就能选中例如”sub-menu”这样的类名或者ID名,其实也是工作需要,代码规范要这样做,之前的驼峰式就废弃了,下划线显然不好,于是就用横线来连接关联起来了,直接来说怎么设置吧.

1. 打开SUBLIME TEXT(2和3都通用.)

2. 打开配置文件Settings – User

快速选择带有横线连接符的类名或ID名
快速选择带有横线连接符的类名或ID名

3. 在花括号内最后一行插入下面这段

"word_separators": "./\\()\"':,.;<>~!@#$%^&*|+=[]{}`~?"

好了,保存文件.试试效果吧.

最后简单说明一下,这行实际上是默认设置里改了,去掉了”“字符,用用户设置覆盖默认设置,有兴趣可以打开Settings – Default,看其他更多设置

sublime text的插件SFTP连接超时

这几天看到关于sublime text的一个连接FTP的插件SFTP,居然能直接修改同步上去.那可是省事多了,以后改内容,直接通过这个修改后上传,也不用FTP工具了.可是省事了,可是在设置正确使用的时候出了点小问题,总是提示连接超时,什么原因呢?

先来说说安装吧,之前很多文章提到了安装插件的过程,这里就不复述了,装好SFTP插件,先要对着需要同步到服务器的目录右键-“Map to remote…“,接着会弹出一个配置文件,我按照经验简单设置了一下,测试连接,却始终连不上去.于是我又仔细查阅了官方的关于SFTP的官方说明,详见:Sublime SFTP Settings,却还是不行,改端口,改密码,改改改…都不行,最后索性试一下这个连接方式改成FTP,效果如何,结果一下就连上了,只知道FTP有主动传输和被动传说,真不知道这个S是用来做啥的,最可恶的是,官方文档说,除特殊情况,请保持默认SFTP…真是服了.

最后上我的配置图:

SFTP设置图
SFTP设置图

如果嫌每次敲密码麻烦,这里可以输入密码就可以了,至于其他配置,可以根据个人需求来设置.

PS:后来发现这个插件总是报错,兼容性有点问题还是怎么回事,大家自行考虑是否使用(2014年6月19日)

Sublime Text 3近期使用总结(常用插件篇)

虽然很早就有了解,不过实际上还是近期因工作需要才开始正式以sublimeText3做主要开发工具.为此费了不少精力学习这个编辑器,现总结如下.

因为网上大部分都是介绍sublime text 2的相关内容,很多插件实际上在3已经不好用了,并且sublime text 3安装插件也不需要调用控制台了(貌似便携版还是需要手动添加,通过快捷键 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())

如果以上报错(上面可能只适用于安装版,如果便携版报错)请试试下面这条

import urllib.request,os,hashlib; h = ‘7183a2d3e96f11eeadd761d777e62404’ + ‘e330c659d4bb41d3bdf022e94cab3cd0’; pf = ‘Package Control.sublime-package’; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( ‘http://sublime.wbond.net/’ + pf.replace(‘ ‘, ‘%20’)).read(); dh = hashlib.sha256(by).hexdigest(); print(‘Error validating download (got %s instead of %s), please try manual install’ % (dh, h)) if dh != h else open(os.path.join( ipp, pf), ‘wb’ ).write(by)

如果还是不行,请参考: https://sublime.wbond.net/installation (更新日期2014年9月4日)

更新日期:2014年5月5日),直接在Preferences里面就可以看到Package Control,进行插件安装.我专也门查了很多资料,根据个人习惯以及工作需要对于sublime text 3的常用插件做了一些整理,有需要的可以参考一下:

bracketHighLighter (Bracket and tag highlighter for Sublime Text)

Bracket Highlighter matches a variety of brackets such as: [](){}""''<tag></tag>, and even custom brackets.
自动在成对标签内的首尾下面添加一个下划线,方便查看是否有遗漏的tag或者js里面少写了一些闭合符号.

继续阅读“Sublime Text 3近期使用总结(常用插件篇)”

Sublime Text 3 中文优化版更新下载了(最后更新2014.9)

最近官网又更新,外加上手头前阵子装了好多插件测试,感觉sublime有点不稳定,于是下载了最新版升级了.并重新根据个人需要安装好插件和扩展包,打包了一份原版的64位的sublime text 3,因为是已经激活了(朋友买的正版),所以就不公开下载了,如果有需要请发邮件我:D

正巧也找到了一个的sublime text 3 3065汉化版,感觉还是不错的.不过如果不常用到GBK编码的话,建议还是用原版了.毕竟汉化版不是我做的,也不过就分享下网络上制作的这个版本:

Sublime Text(代码编辑器) v3.3065 中文破解版
Sublime Text v3.3065版本制作说明:
1.基于 Sublime Text 3 官方版进行修改汉化;
2.软件已默认注册且已去除自动检测升级提示;
3.调整字体大小为 11px 以适合大众使用习惯;
4.深度整合GBK编码已能够完美支持GBK文件;
5.默认安装了Emmet (Zen Coding)插件;
6.增加了配色非常舒服的Theme-Nil主题;
7.修改多处细节和配置文件使其更人性化;

Win7 用户请使用“Win7”文件夹中的“SublimeText.exe”替换“SublimeText2”目录中的同名文件,即可正常运行。

以上内容摘自Sublime Text(代码编辑器) v3.3065 中文破解版,压缩包内包含了X86和X64两个版本安装包,不过可能带有广告,如有需要可以测试一下~
最后更新:2014.09


前阵子还在研究st2的用法,没想到这么快3的汉化版都出来了.正巧看到,才与大家分享.

Sublime Text 3
Sublime Text 3截图

下载页面: Sublime Text3 Buld 3059 简体中文优化版

继续阅读“Sublime Text 3 中文优化版更新下载了(最后更新2014.9)”

Vimeo的关于Sublime Text 2插件Zencoding用法演示视频下载

之前研究这个zencoding插件,觉得异常强大,导出搜集相关资料,学习使用,其中关于这段简短的各种功能操作视频却被墙了,闲着蛋疼,用VPN出去把这个视频下载了下来,传到了skydriver,有兴趣的朋友可以去下载原版的,原版视频本身不大,本以为上传到youku能够清晰的显示出来结果大失所望,想看清晰的还是去下载吧.

直接查看youku版本:

继续阅读“Vimeo的关于Sublime Text 2插件Zencoding用法演示视频下载”