Zen Coding 快速编写HTML/CSS代码的实现(4)

Aptana是我主要的开发环境,它使用一个JavaScript版本的Zen Coding。它也包含很多其它的我用于日常工作的工具,所以任何一个新的Zen Coding版本都将会首先对Aptana可用,然后部署到Python并兼容其它的编辑器。

Coda和Espresso 插件被杰出的Text Editor Actions (TEA) 平台支持,由Ian Beck开发。原始的源代码在GitHub上,但我还是制作了我自己的分支以整合Zen Coding的特性。

总结

很多尝试过Zen Coding的人都说它改变了他们写页面的方式。当然还有很多事情要做,还有很多的编辑器需要被支持以及一些文档要写。请浏览现在的文档 以及以寻找你的问题的答案。希望你喜欢Zen Coding!

附:Zen coding的具体用法

遗憾的是, 本文原作者并没有说明zen coding的具体用法,神飞认为有必要做以下简要的说明。这里就以Aptana/Eclipse和Dreamweaver为例,其它编辑器平台暂不描述,如有疑问可以在评论中与前端观察的网友交流。

Aptana/Eclipse

由于Aptana本身就是基于Eclipse的,所以,Zen Coding也是支持Eclipse的,只是需要一个EclipseMonkey插件的支持,Aptana已经封装了这个插件,所以如果你使用Aptana,下面的第一步可以跳过。

通过更新网站安装EclipseMonkey: (如果你使用Aptana,可跳过这一步) 在你的当前工作去创建一个顶级的项目,给它命名,比如,就叫zencoding 在新创建的项目中创建scripts文件夹 解压缩下载的ZIP插件包到该文件夹。项目结构看起来就像这样:

Zen Coding 快速编写HTML/CSS代码的实现

安装之后,Aptana的菜单栏中的“脚本(Script)”菜单中将会出现Zen coding相关子菜单

注意事项:

Aptana版的官方插件是基于MAC机的,如果你用的是Windows,需要手动更改快捷键(在每个文件头部的注释片段中更改) 官方的文件编码有点儿乱,修改官方js的时候,请注意编码问题,修改不当会造成相关功能的丢失; DreamWeaver

好消息是,现在已经有了Zen coding for DreamWeaver插件,坏消息是,该插件支持的功能很少,只支持展开缩写功能。而且默认的快捷键是无效的。只能在“命令”菜单中点击操作。另外,没有测试该插件是不是只支持CS4版本。不过比较好的是,作者将本插件的源码也放出了,你可以自定义一个Dreamweaver的插件。

事实上,官方的DW插件在Windows下有点儿bug,就是会出现空白的行,我简单的修正了下,重新编译了个包,在本机测试没问题,感兴趣的童鞋可以下载尝试:

PS:官方的DW插件已经更新,推荐到官方去下载。新的插件添加了更多的功能支持。UPDATE @ 12-23-2009

特别推荐:豪情同学将缩写给实践了一番,总结出了很多很棒的用例,推荐大家前去学习

原作者介绍:

Sergey Chikuyonok是一位俄罗斯的前端开发工程师和作者,他在优化方面有很大的热情:从图片、JavaScript效果到工作流程和节省时间的编码。访问他的主页他的Twitter

原文来自:

您可能感兴趣的文章:

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wzgzyx.html