这篇主要讲部署下ExtJS开发环境,以及搭建项目。我们使用ExtJs官方提供的Sencha Cmd来搭建
1.搭建项目
1.下载官方的Sencha Cmd工具,安装。
2..Window用户进入到命令提示符。
输入命令 sencha -sdk F:迅雷下载ext-5.1.0-gplext-5.1.0(替换成你的ExtJS Sdk路径) generate app app .
至此项目文件已经生成好了,在D:learnExtJs目录。
其实sencha cmd 自带了一个服务器, 在命令行状态下继续输入命令:sencha web start就可以启动一个服务。当然你也可以用IIS或者tomcat之类的把这个目录发布。
启动完服务,在浏览器输入http://localhost:1841/,我们可以看到下面的界面效果:
至于生成的目录结构我就不多说了。
进入app目录,我们可以看到有model,store,view三个文件夹,其实还应该有一个controller文件夹:
其实这就是4.X推出的MVC模式(本系列教程不用它),Application.js就是整个应用程序的入口(只针对于单页面程序来说),然后我们进入到View/mian/里面。
可以看到Mian.js这个就是视图文件,Controller就是视图对应的控制器文件。MainModel.js就是视图对应的视图模型文件。这就是5.X版本推出的MVVM模式。
来,我们一起用这种方式来建立一个HelloWorld.js,HelloWorldController.js和HelloWorldModel.js把。