extjs6整合到web项目中

2024-05-13 14:06:19

最近有一个项目需要应用extjs作为前端界面，因此研究了一下如何将extjs 6引入到项目中。以下是操作步骤

extjs6下载地址

extjs 6有gpl版本的，下载地址https://www.sencha.com/legal/gpl/

sencha cmd 搭建extjs 6环境

安装sencha cmd
下载extjs6 并解压
cmd 进入到extjs6的解压目录执行sencha应用程序生成命令

       sencha -sdk {pathToSDK} generate app {appName} {pathToProject}

启动sencha 容器

      sencha web -port 1841 start

sencha容器默认的访问地址为http://localhost:1841。如果使用默认端口可以不写-port参数，如果是其他端口必须带上-port参数,

如果访问的页面是文件的目录，则需要先进行sencha app build 然后再启动sencha的web容器

sencha cmd其他指令

       sencha app buildsencha app watchsencha app refresh

extjs6本地化

extjs6的本地化是在app.json文件中配置的，不需要直接引入本地化的js文件。本地化参数配置在classisc的参数中，添加以下配置节点参数。

    //以下是新增的添加本地化包的代码        "requires" : ["locale"],"locale": "zh_CN"

配置完毕后需要使用sencha cmd 通过sencha app build重新构建extjs 6才能生效。

extjs 目录说明

extjs通过sencha 构建解压后的目录结构说明

     app                extjs的开发源码目录，包含应用的模型、视图、控制器及存储定义目录。- -     controller 控制器   - -     model      模型- -     store      数据- -     view       视图build              extjs和源码压缩和优化后的可发布的目录ext                extjs的sdk包括源代码和样式app.js             应用主入口javascript文件。app.json           js配置文件bootstrap.js       系统初始化和样式类加载文件index.html         应用HTML入口文件packager.json      用于Sencha Cmd 创建打包应用时的配置文件resources          包含应用所需的CSS和图片资源。

web项目中需要的extjs文件和目录

extjs-all.js
extjs-base.js
zoomkey
resource
plugins

extjs引入到web项目中

将sencha 生成的extjs目录拷贝到web项目中。

参考资料

http://www.qeefee.com/article/000338
http://docs.sencha.com/extjs/6.0/getting_started/getting_started.html
http://lzw.me/a/sencha-touch-getting-started.html

http://blog.csdn.net/tianxiaode/article/details/46744591

http://extjs-doc-cn.github.io/ext4api/#!/api/Ext.data.proxy.Rest

extjs6整合到web项目中相关推荐

使用H5Stream实现rtsp流播放，并整合到web项目中
更新!!!这篇博客最早是工作要求实现rtsp流媒体播放,所以做了一个demo测试下,后来又不需要做这个功能了,遂没有再深入研究,只记录了之前的学习结果,最近发现有小伙伴留言说流媒体无法播放,我看了下, ...
重新学习Spring一--Spring在web项目中的启动过程
1 Spring 在web项目中的启动过程 Spring简介 Spring 最简单的功能就是创建对象和管理这些对象间的依赖关系,实现高内聚.低耦合.(高内聚:相关性很强的代码组成,既单一责任原则:低耦 ...
asp.net Web项目中使用Log4Net进行错误日志记录
使用log4net可以很方便地为应用添加日志功能.应用Log4net,开发者可以很精确地控制日志信息的输出,减少了多余信息,提高了日志记录性能.同时,通过外部配置文件,用户可以不用重新编译程序就能改变 ...
FastDFS (五) --------- FastDFS 在 web 项目中的应用
目录前言一.数据库环境搭建二.开发环境搭建三.功能设计 1. 展示所有债权信息 2. 为某一个债权合同上传文件 3. 下载某一个债权合同 4. 删除某一个债权合同,使用 ajax 实现异步删除 ...
JAVA Web项目中所出现错误及解决方式合集（不断更新中）
JAVA Web项目中所出现错误及解决方式合集前言一.几个或许会用到的软件下载官网二.Eclipse的[preferences]下没有[sever]选项三.Tomcat的安装路径找不到四.T ...
maven mybatis mysql_Java Web学习系列——Maven Web项目中集成使用Spring、MyBatis实现对MySQL的数据访问...
标签: 本篇内容还是建立在上一篇Java Web学习系列--Maven Web项目中集成使用Spring基础之上,对之前的Maven Web项目进行升级改造,实现对MySQL的数据访问. 添加依赖Ja ...
在java web项目中编写自己的代码生成器
在java web项目中编写自己的代码生成器转载于:https://www.cnblogs.com/punisher/p/5909943.html
在web项目中发布jaxws
概述在web项目中发布基于jaxws的webservice. 参考文章:用JAX-WS在Tomcat中发布WebService 参考文章说,如果不是servlet3.0及以上,需要配置servlet ...
Web项目中引进EasyUI的路径问题
场景 Web项目中引入EasyUI,新建test.html,页面中引入EasyUI相关资源文件. 运行后页面并没有改变,打开检查提示404找不到资源. 实现项目路径为: 路径引用错误: test.h ...
由web项目中上传图片所引出的路径问题
我在做javaweb项目的时候,有个项目中需要进行图片的上传,有次我重新部署项目后,发现之前上传的图片不见了,最后找出原因:图片上传在服务器目录上,而不是绝对路径,所以特别想弄清楚javaweb项目中 ...

最新文章

热门文章