ExtJS实战(1)——eclipse搭建ExtJS4开发环境以及第一个程序Helloword

互联网的时代,web开发永远是一个充满希望的的主题,最近有接触了一门新知识ExtJs了废话少说,下面介绍本人在

eclipse上搭建ExtJS4.0.7开发环境的过程。希望能给大家带来一些方便,以便少走一些弯路,毕竟本人刚开始的时候也

花了不少时间去查阅资料学习如何搭建。


准备工作:

eclipse 版本:eclipse-jee-indigo-SR2-win32-x86_64

ext版本:ext-4.0.7-gpl

智能提示插件版本:spket-1.6.23.jar


安装过程:

(1)学到ext的,eclipse的安装就不多说了

(2)先安装智能提示插件

              1)双击运行spket-1.6.23.jar,傻瓜式安装,安装过程选好eclipse的安装目录

              (如D:\Program Files (x86)\eclipse)和spket的安装目录( 如D:\ProgramFiles (x86)\spket)即可

              2)安装完spket后,重启eclipse,会看到Window→ Proferences里会多一个Spket的选项

                       3)选择JavaScript Profiles,点击new→ 新建立Ext→ 点击Add Library→ 选择ExtJS,建立新的 Library,点                击Add File,→ 选择extjs4.0.7包里build文件夹里带的sdk.jsb3,最后还可以点击Default让其成为缺省的                JavaScript Pro File.如下图:



                  4)设置js的默认编辑器





至此,spket插件安装完成,下面介绍第一个程序——Helloword


(1)新建一个Dynamic Web project,为了防止引入ext-4.0.7-gpl时出现错误,项目右击——点击Properties——弹出对话框点击Builders——去掉javascript validator上的勾即可,如下图:



2)接下来将ext-4.0.7-gpl整个文件拷到项目的WebContent目录下,这时候为了减少项目文件的大小还可以将一些不影响项目开发的extjs多余的文件去掉,比如例子(examples)、文档(doc)等统统移除,留着语言包(locale)、css样式包(resources)、src及extjs的核心文件ext-all.js等,如下图



3)接下来建立自己的javascript文件夹和页面文件夹,如下图:




(4),双击打开helloword.js编写ExtJS文件,如图(因为之前我们安装了spket,所以当输入Ext.的时候就会出现提示,这能大大提高我们的开发效率)




(5)编写html文件




(6)项目测试,在浏览器输入http://localhost:8080/ExtJS4/pages/Helloword.html,结果如下


运行成功了,虽然没有阴影,但不影响我们的测试。


至此,在eclipse上搭建Extjs开发环境和编写第一个Helloword程序的工作已经完成。




  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值