Ext JS 5初探(一)
2014-04-10 22:06
357 查看
在开始前,先安装好Sencha Cmd 5。然后输入以下命令创建一个测试用的应用程序:
想不到Sencha Cmd 5的提示简洁了那么多,以下是输出:
下面使用Sencha Cmd的Web服务器功能来测试一下生成的应用程序,命令如下:
在浏览器地址栏输入“localhost:8000”,会看到如下图所示的效果。应用程序结构和Ext JS 4时生成的应用程序结构一样,只是多了按钮和说明。
下图是生成的目录结构,这个和Ext JS 4时的结构没有变化。
下面来看看具体的文件的内容,首先来看看启动用的index.html文件,代码如下:
这个变化可大了,4需要将加载的文件一个个的写上去,这里只需要加载bootstrap.js文件就行了,联样式文件也不需要。下面要研究的就是这个bootstrap.js文件了。由于这个文件代码比较多,所以在下篇文章再给大家分析。
sencha -sdk c:\ext5 generate app TestExt5 C:\TestExt5
想不到Sencha Cmd 5的提示简洁了那么多,以下是输出:
Sencha Cmd v5.0.0.116 [INF] Loading app json manifest... [INF] Writing content to C:\TestExt5/bootstrap.js [INF] Writing content to C:\TestExt5/bootstrap.json
下面使用Sencha Cmd的Web服务器功能来测试一下生成的应用程序,命令如下:
sencha fs web -port 8000 start -map C:\TestExt5
在浏览器地址栏输入“localhost:8000”,会看到如下图所示的效果。应用程序结构和Ext JS 4时生成的应用程序结构一样,只是多了按钮和说明。
下图是生成的目录结构,这个和Ext JS 4时的结构没有变化。
下面来看看具体的文件的内容,首先来看看启动用的index.html文件,代码如下:
<!DOCTYPE HTML> <html> <head> <meta charset="UTF-8"> <title>TestExt5</title> <!-- The line below must be kept intact for Sencha Cmd to build your application --> <script id="microloader" type="text/javascript" src="bootstrap.js"></script> </head> <body></body> </html>
这个变化可大了,4需要将加载的文件一个个的写上去,这里只需要加载bootstrap.js文件就行了,联样式文件也不需要。下面要研究的就是这个bootstrap.js文件了。由于这个文件代码比较多,所以在下篇文章再给大家分析。
相关文章推荐
- Ext JS 5初探(一)
- js 小技巧
- ExtJS 最好用的 IDE : APTANA Studio 3 + Spket 插件的安装
- HTML5的自定义属性data-*详细介绍和JS操作实例
- js 递归调用
- iOS7新JavaScriptCore框架介绍
- Newtonsoft.Json WindowPhone7.1
- Json的笔记和摘抄
- jsp中9个内置对象与servlet对应关系及四个作用域
- JSON返回DateTime/Date('123123123')/解决办法
- JSON返回DateTime/Date('123123123')/解决办法
- JSON返回DateTime/Date('123123123')/解决办法
- JavaScript中的正则表达式
- js中用正则表达式判断字符串中是否包含中文和英文
- js 原始值和引用传递
- 【JavaScript】JavaScript之快速入门
- 浅谈javascript函数,变量声明及作用域
- JS中生成与解析JSON
- JS中生成与解析JSON
- 原始JS选择器使用方法和常用事件手册