http://www.cnblogs.com/matchless/archive/2013/04/09/3010293.html
Sublime text 2 是获得了盛赞的编辑器,而其中的 zen coding 插件也为人所津津乐道!
如今,这两款软件都有了新的版本,Sublime text 3 beta 版已经发布了,zen coding 也改名为 Emmet,其安装方法也与之前有所不同。
下面就来介绍一下【如何在 Sublime Text 3 中安装 Emmet 插件】:
首先,安装 sublime text 3:
sublime text 3 的官方下载地址为:http://www.sublimetext.com/3 ,截止本篇博文发布的日期,最新版本为 3021。关于汉化和注册,请自行百度、谷歌。
我下载的是 portable version 便携版。直接解压到文件夹中就可以用了,我解压在 D:Program FilesSublime Text 3文件夹中,下面的示例均以此为准,请根据自己的情况修改示例中的指令。对于下载了 安装版 的朋友,也请将示例中的文件夹修改为具体的安装位置。
其次,安装 sublime text 3 的 Package Control:
由于升级为 sublime text 3,原来 sublime text 2 中直接用指令安装 Package Control 的方式已经不能使用了,报如下错误:
解决方式是使用 git 直接下载安装,windows 下 git 可以使用 msysgit,下载地址为 Git-1.8.1.2-preview20130201.exe ,或者使用 TortoiseGit,下载地址为 http://code.google.com/p/tortoisegit/wiki/Download 。
对于使用 git 命令行方式,进入控制台(在“运行”中,输入 cmd 回车),转到 D:Program FilesSublime Text 3DataPackages,输入如下指令:
D:Program FilesSublime Text 3DataPackages>git clone https://github.com/wbond/sublime_package_control.git "Package Control" D:Program FilesSublime Text 3DataPackages>cd Package Control D:Program FilesSublime Text 3DataPackages>git checkout python3
重新启动 Sublime Text 3,可以在 Preferences 菜单下看到 Package Settings 和 Package Control 菜单项,表明 Package Control 安装成功。
对于安装了 TortoiseGit 的朋友,在“我的电脑”或“计算机”中打开 D:Program FilesSublime Text 3DataPackages 文件夹,在空白处右击,选择 Git Clone...,弹出如下对话框:
在URL中输入:https://github.com/wbond/sublime_package_control.git,在Directory中将路径修改为 D:Program FilesSublime Text 3DataPackagesPackage Control,如下图所示:
或者使用git bash : D:Program FilesSublime Text 3DataPackages>git clone https://github.com/wbond/sublime_package_control.git "Package Control"
单击 OK。
单击 OK,Sublime Text 3 的 Package Control 安装成功。
再次,安装 Emmet 插件:
启动 Sublime Text 3,选择 Preferences>Package Control,点选 Package Control:Install Package:
输入 Emmet 并回车:
界面最下方显示:
表明 Emmet 插件正在安装。
在 Emmet 安装完成后,会显示如下屏幕:
请注意红框内的文字,和左下角绿色框内的提示:
红框内的文字是说“这个插件会自动下载和安装 PyV8,请看状态条信息”,而左下角的绿色框内的提示就是正在下载、安装和载入 PyV8。
在PyV8安装完成后,重启 Sublime Text 3。
最后,运行 Emmet:
重启 Sublime Text 3,会看到左下角再次出现 Loading PyV8 的提示,待其载入完毕,打开一个新文档,按下 Control + Alt + Enter,会弹出如下提示框:
直接关闭它(我没有发现这个错误对 Emmet 插件的使用有什么影响)。
在下方的命令窗口输入 ZenCoding 指令就可以了。
或者也可以直接在文本区输入 Emmet (ZenCoding) 指令,再按下 Ctrl + E,如:
table.MyTable>tr.MyTableTr*3>td.MyTableTr*5,按下 Ctrl+E,生成如下表格:
<table class="MyTable"> <tr class="MyTableTr"> <td class="MyTableTrTd"></td> <td class="MyTableTrTd"></td> <td class="MyTableTrTd"></td> <td class="MyTableTrTd"></td> <td class="MyTableTrTd"></td> </tr> <tr class="MyTableTr"> <td class="MyTableTrTd"></td> <td class="MyTableTrTd"></td> <td class="MyTableTrTd"></td> <td class="MyTableTrTd"></td> <td class="MyTableTrTd"></td> </tr> <tr class="MyTableTr"> <td class="MyTableTrTd"></td> <td class="MyTableTrTd"></td> <td class="MyTableTrTd"></td> <td class="MyTableTrTd"></td> <td class="MyTableTrTd"></td> </tr> </table>