eclipse+spket+Extjs4.2.1开发环境搭建

一、开发工具配置


       1http://www.eclipse.org/downloads/下载Eclipse,解压。

        2http://spket.com/download.html下载Plugin,解压后覆盖到Eclipse的目录。

       3、启动Eclipse,选择windowproferencespketjavascriptprofilesnew (输入Ext JS4.2.1)


eclipse+spket+Extjs4.2.1开发环境搭建_第1张图片


    4Add libary(选择ExtJS)


eclipse+spket+Extjs4.2.1开发环境搭建_第2张图片


        5Add file(选择ext-all-dev.js),注意整个路径不能出现中文。


eclipse+spket+Extjs4.2.1开发环境搭建_第3张图片


    6、选中Ext JS 4.2.1,设置默认。


eclipse+spket+Extjs4.2.1开发环境搭建_第4张图片


        7、将 js默认打开方式设为 spket(如果不成功,请重复检查上面的步骤,重点检查第6步,设置默认成功之后字体明显变黑)


eclipse+spket+Extjs4.2.1开发环境搭建_第5张图片


        8、重启Eclipse

        9、新建javascript文件,输入Ext+. 则会出现自动提示

eclipse+spket+Extjs4.2.1开发环境搭建_第6张图片

如果没有出现自动提示则右击你的JS文件,有个Open with - 选择spket JavaScript Editor 如果仍旧没有出现提示则可以通过在项目文件上点击右键,选择“Reload Javascript Profiles”菜单,对javascript文件重新加载。


 二、ExtJS开发环境搭建

       (1)  下载Ext开发包,下载地址http://extjs.org.cn/

    

        (2)  将Ext开发包copy到eclipse项目的/WebRoot目录下

             注意:不需要整个Ext开发包全部导入,这样很容易造成eclipse卡死,因为eclipse会自动检测js的合法性,会占用大量的检测时间、cpu和内存。通常普通的开发只需要用到\extjs-4.2.1\resources文件包、\extjs-4.2.1\ext-all.js这两个资源就可以,需要中文化再导入\extjs-4.2.1\locale\ext-lang-zh_CN.js 就可以了


        (3) 在web页面中通过 // 中文化


    (4) 调用Ext.onReady()初始化组件

       


三、hello word 实例


hellowrod.js

(function()
	{
	 Ext.onReady(function()
	 {
		Ext.Msg.alert("hello wrod!");  //弹出hellowrod对话框 (实例化组件)                                                                                 }                                                                                                                                                                                                                                                                                                                 })(); 
                                                            
html代码





Insert title here



//资源样式文件

//中文化




 
  
 
  
 
  
 
 

你可能感兴趣的:(Extjs)