﻿<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/"><channel><title>BlogJava-砖头-文章分类-extjs2.0</title><link>http://www.blogjava.net/yaozhuan/category/29601.html</link><description /><language>zh-cn</language><lastBuildDate>Sat, 23 Feb 2008 05:36:59 GMT</lastBuildDate><pubDate>Sat, 23 Feb 2008 05:36:59 GMT</pubDate><ttl>60</ttl><item><title>主题：围绕Ext JS 2.0的IDE、插件和工具 by Jack Slocum(转)</title><link>http://www.blogjava.net/yaozhuan/articles/181384.html</link><dc:creator>砖头</dc:creator><author>砖头</author><pubDate>Fri, 22 Feb 2008 06:08:00 GMT</pubDate><guid>http://www.blogjava.net/yaozhuan/articles/181384.html</guid><description><![CDATA[<span style="font-size: 8pt;"><span style="font-size: 10pt;"><span style="font-size: 12pt;">Ext 2.0的API包含许多的方法（函数）、属性和配置项，涵盖的面非常大，要全部列出几乎是不可能的。虽然<a href="http://extjs.com/deploy/dev/docs/" target="_blank">API文档</a>是童叟无欺精心打造的，但实际开发中，若果能够像其它语言Java和C#那样地支持JavaScript代码提示，那就更好啦。可喜的是，有若干的开发环境（IDE）和插件能够支持－－并且是直接支持Ext 2.0。<br />
<br />
&nbsp; &nbsp; <strong>Aptana Studio</strong><br />
&nbsp; &nbsp; 一谈到JavaScript的开发工具，就不得不提<a href="http://aptana.com/studio/" target="_blank">Aptana</a>了。就我实际工作来说，每天都用它来完成Adobe AIR的工作。但是Aptana当前捆绑的Ext的版本有些旧（1.1的），下面就介绍一个<a href="http://orsox.mocis.at/download.php?view.1" target="_blank">插件</a>的安装方法，让Aptana支持到2.0（由Markus Schmidleitner提供，用起来还不错）：<blockquote>1.下载并安装Aptana Studio;<br />
2.打开你的Aptana程序目录（我这儿是C:\Aptana），复制jar格式的文件到plugins目录；<br />
3.重启Aptana；<br />
4.进入Window -&gt; Preferences -&gt; Aptana -&gt; Editors -&gt; JavaScript -&gt; Code Assist选择Ext 2.0（或要反选Ext.1.1）。</blockquote>
<p><br />
<img src="http://extjs.com/playpen/screenshots/codeassist/aptana.gif" alt="" border="0" /></p>
<p align="center"><span style="font-size: 10px;">Aptana Studio with Ext 2.0 code assist</span></p>
<br />
<strong>Spket Eclipse插件与IDE</strong><br />
&nbsp; &nbsp; <a href="http://www.spket.com/" target="_blank">Spket IDE</a>是目前支持Ext 2.0最为出色的IDE。 它采用.jsb project file 文件并将继承于基类和所有文档的内容嵌入到生成代码提示的Script doc中。<br />
&nbsp; &nbsp; 由于Spket只是一个单纯的编辑器，没有其它格式的支持（如CSS），所以我的做法是用它的Eclipse插件形式，安装到Aptana。安装办法如下：<br />
<blockquote>&nbsp; &nbsp; 1.下载安装Aptana Studio（包含有Eclipse）；<br />
&nbsp; &nbsp; 2.启动Aptana并打开程序菜单到：Help &#8594; Software Updates &#8594; Find and Install&#8230; &#8594; Search for new features to install &#8594; New remote site&#8230; <br />
&nbsp; &nbsp; 3.名称: &#8220;Spket&#8221;，地址URL是<a href="http://www.spket.com/update/" target="_blank">http://www.spket.com/update/</a> <br />
&nbsp; &nbsp; 4.重启Aptana；<br />
&nbsp; &nbsp; 5.观看一下这个SketIDE的<a href="http://www.spket.com/demos/js.html" target="_blank">教程</a>，看看Ext代码提示的功能有多省事（你可以修改/src/ext.jsb 保持最新版的Ext），基本步骤如下：<br />
<ol>
    <li>Window &#8594; Preferences &#8594; Spket &#8594; JavaScript Profiles &#8594; New ；</li>
    <li>输入&#8220;ExtJS&#8221;点击OK； </li>
    <li>选择&#8220;ExtJS&#8221; 并点击&#8220;Add Library&#8221;然后在下拉条中选取&#8220;ExtJS&#8221;； </li>
    <li>选择 &#8220;ExtJS&#8221;并点击&#8220;Add File&#8221;，然后在你的./ext-2.x/source目录中选取&#8220;ext.jsb&#8221; 文件；</li>
    <li>设置新的ExtJS Profile，选中并点击&#8220;JavaScript Profiles&#8221; 对话框右手边的&#8220;Defalut&#8221;按钮；</li>
    <li>重启Aptana； </li>
    <li>创建新的JS文件并输入： Ext这样就可设置Ext Code代码自动完成的功能。</li>
</ol>
</blockquote><br />
&nbsp; &nbsp; 由于你是在Aptana中安装插件的，Aptana还是你默认的JS编辑器，所以要试用Spket，你要在那个文件上选中&#8220;Open with&#8221;－&gt; Spket JavaScript Editor 。<br />
<br />
<img src="http://extjs.com/playpen/screenshots/codeassist/spket.gif" alt="" border="0" />
<p align="center"><span style="font-size: 10px;">Spket in Aptana with full documentation and code assist</span></p>
<p><br />
<strong>Komodo Edit </strong><br />
&nbsp; &nbsp; <a href="http://www.activestate.com/Products/komodo_edit/" target="_blank">Komodo Edit</a>为众多格式文件提供支持，包括Perl、PHP、Python、Ruby和Tcl。亦支持浏览器方面的代码包括有JavaScript、CSS、HTML和XML。Windows、Mac Os和Linux平台都可用。<br />
&nbsp; &nbsp; 安装Ext支持下的Komodo：</p>
<blockquote>&nbsp; &nbsp; 1.下载和安装Komodo Edit；<br />
&nbsp; &nbsp; 2.下载<a href="http://community.activestate.com/komodo-extension/extjs-api-catalog-collection" target="_blank">API catalog</a>；<br />
&nbsp; &nbsp; 3.进入Edit -&gt; Preferences -&gt; Code Intelligence 并选择位于&#8220;API Catalog&#8221;下方的按钮&#8220;Add an API catalog&#8221; ；<br />
&nbsp; &nbsp; 4.选择刚才下载的ExtJS API cat<a href="http://www.activestate.com/Products/komodo_edit/" target="_blank">Komodo Edit</a>alog CIX 。</blockquote>
<p><br />
<img src="http://extjs.com/playpen/screenshots/codeassist/komodo.gif" alt="" border="0" /></p>
<p align="center"><span style="font-size: 10px;">Komodo with Ext JS code intelligence</span></p>
<br />
<strong>Dreamweaver</strong><br />
&nbsp; &nbsp; 对于Dreamweaver的用户，有两种可用的插件<a href="http://www.spket.com/dreamweaver-extension.html" target="_blank">SpketDW</a>(Dreamweaver 2004或新版)和<a href="http://www.spket.com/dreamweaver-extension.html" target="_blank">SpketDWCS</a>(Dreamweaver CS3)。两者都是Spket团队开发的(刚才提及的)，因此也同样精确和出色。另外Dreamweaver插件的一大特点是很好地支持配置项的代码提示。<br />
<p align="left">&nbsp;</p>
<br />
<span style="float: left;"><span style="font-family: 宋体;"><img src="http://extjs.com/playpen/screenshots/codeassist/dw-fns.gif" alt="" border="0" /></span>
<p align="center"><span style="font-size: 10px;"><span style="font-family: 宋体;">Members code assist</span></span></p>
<br />
<p align="center"><span style="font-size: 10px;"><br />
</span></p>
<br />
</span><br />
<p align="left">&nbsp;</p>
<p align="left">&nbsp;</p>
<br />
<span style="float: left;">
<p align="center"><span style="font-family: 宋体;"><img src="http://extjs.com/playpen/screenshots/codeassist/dw-configs.gif" alt="" border="0" /></span></p>
<br />
<p align="center"><span style="font-size: 10px;"><span style="font-family: 宋体;">Config option code assist</span></span></p>
<br />
<p align="center"><span style="font-size: 10px;"><br />
</span></p>
<br />
</span><br />
<p align="left">&nbsp;</p>
<p align="left"><span style="font-family: 宋体;"><span style="font-family: 宋体;"><span style="font-family: Arial Unicode MS;"><br />
</span></span></span></p>
<p align="left">&nbsp;</p>
<p align="left">&nbsp;</p>
<p align="left">&nbsp;</p>
<p align="left">&nbsp;</p>
<p align="left">&nbsp;</p>
<p align="left">&nbsp;</p>
<p align="left">&nbsp;</p>
<p align="left">&nbsp;</p>
<p align="left">&nbsp;</p>
<p align="left">&nbsp;</p>
<p align="left">&nbsp;</p>
<br />
<p align="left">&nbsp;</p>
<p align="left"><span style="font-family: 宋体;"><span style="font-family: 宋体;"><span style="font-family: Arial Unicode MS;"><br />
</span></span></span></p>
<p align="left"><br />
</p>
<p align="left">&nbsp;</p>
<p align="left">&nbsp;</p>
<p align="left">&nbsp;&nbsp; 要下载和安装，请浏览他们的<a href="http://www.spket.com/dreamweaver-extension.html" target="_blank">站点</a>。<br />
<br />
<strong>其它的IDE</strong><br />
&nbsp; &nbsp; 还有其它的IDE,像由社区发起的正在工作着的IntelliJ和<a href="http://extjs.com/forum/showthread.php?t=18751" target="_blank">Visual Studio 2008</a>。<br />
<br />
<strong>总结</strong><br />
&nbsp; &nbsp; 当工作中需要到Ext 2.0，的确有一些工具能辅助你提升工作效率，这真的要比较一番（Check them out、check out、checkout...）。如果你也发现有其它更好的工具，不妨雁过留声，与我们分享。</p>
</span></span></span>
<img src ="http://www.blogjava.net/yaozhuan/aggbug/181384.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.blogjava.net/yaozhuan/" target="_blank">砖头</a> 2008-02-22 14:08 <a href="http://www.blogjava.net/yaozhuan/articles/181384.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item></channel></rss>