ExtJS 项目准备工作(一)
首先,需要从网上下载两个文件,一个是SenchaCmd-6.2.0-windows-64bit(我的电脑是window 10 64位) 另一个是ExtJs6的源码包(ext-6.0.0.415)。
源码下载地址:http://pan.baidu.com/s/1ntqqZpB
sencha cmd 下载地址:https://www.sencha.com/products/sencha-cmd
解压之后安装cmd,运行 SenchaCmd-6.2.0.103-windows-64bit.exe文件,一直按提示安装,安装成功后打开windows的cmd 输入sencha会有如下的显示,得到如图:
安装成功,接下来就是创建项目
配置:
想要建立新的项目需要在控制台输入一下命令:
1.先进入你想创建extjs的目录下(我的在E盘,ExtJS6下),先在cmd 输入E:,进入E盘,然后cd extjs6,进入目录
2.控制台输入:sencha -sdk ExtJs6的源码包(ext-6.0.0.415)路径 generate app [项目名称] [项目路径]
根据我的实际情况 命令为 sencha -sdk D:\ext-6.0.0.415 generate app App .
如图得到目录文件:
其中注意有两个文件夹:classic和modern,他们分别是桌面端和移动端代码放的位置。ExtJs项目是MVC模式的,在上面两个文件夹下放的一般是View页面。因为移动端和桌面的页面布局肯定不一样。他们的逻辑是相同的。所以桌面和移动端的逻辑被放在了app文件夹下,打开文件夹可以看到子文件夹view下的main文件夹下有两个文件,一个是MainContorller.js一个是MainModel.js分别是View的数据模型和控制器。
另外主要的文件夹例如:sass是放置样式的resources是放置资源的。其他的先不用管他。
其中下面有一些文件:
1.app.js是应用程序配置文件,描述了应用程序的名称启动页等
2.app.json也是应用程序配置文件,主要描述了一些路径,ExtJs中集成了很多资源比如一些js和css等,他做的作用是,描述这些资源的位置等
3.bootstrap.js是引导文件,在项目启动前做启动引导,简单地说就是把该引入地引入,该配置地配置,以便加载好所需资源,显示项目页面。bootstrap.js是从app.json中读取配置然后启动的。
4.index.html是项目的主页,如果你直接打开会发现什么也显示不出,这是因为需要把项目放在服务器中才能启动,你可以把他放在tomcat中也可以放在iis中然后再通过index.html访问。如果觉得配置服务器麻烦,sencha cmd 给我们提供了一个方便的方法:
创建完成后,会有默认的网页
cmd 输入:sencha app watch
sencha自动在本地1841端口建立一个服务器,并把当前项目部署到服务器上:
这时候我们便可以访问这个项目了。
打开浏览器,地址栏输入http://localhost:1841/得到:
项目创建完成。
ExtJS 项目准备工作(一)的更多相关文章
- [2017BUAA软工助教]个人项目准备工作
BUAA软工个人项目准备工作 零.注册Github个人账号(你不会没有吧..) 这是Git的使用教程: http://www.cnblogs.com/schaepher/p/5561193.html ...
- Django商城项目笔记No.2项目准备工作
Django商城项目笔记No.2项目准备工作 接着上篇开始,创建好工程之后,随之而来的是怎么配置工程,这篇文章记录如何进行相关的配置 1.pycharm打开工程,进行相关的配置 通过pycharm打开 ...
- Django商城项目笔记No.1项目准备工作
Django商城项目笔记No.1项目准备工作 一.本项目商城属于B2C商业模式 二.项目采用前后端分离的应用模式 前端使用Vue.js 后端使用Django REST framework 1.创建gi ...
- extJs项目实战
extjs是因为在公司用到一次,也是公司唯一一个extjs的项目,当时拿到这个需求的时候,我有点懵逼,这他妈的什么鬼,参加工作两年不到的纯小白,没办法,这是工作,必须要完成的.硬着头皮做吧,好在最后弄 ...
- Extjs 项目中常用的小技巧,也许你用得着(2)
接着来,也是刚刚遇到的 panel怎么进行收缩 collapsible: true, 这会panel就会出现这个 点这个就可以收缩了 panel怎么随便拉伸,也就是让那个小黑三角出现 split: t ...
- Extjs 项目中常用的小技巧,也许你用得着(1)
我在项目中遇到的一些知识点: 1.在GridPanel中显示图片,效果 对应的代码实现 { text: '是否启用', width: 80, // xtype: 'checkcolumn', data ...
- SMBMS项目-准备工作
项目搭建准备工作 1.基础准备工作 搭建一-个maven web项目 配置Tomcat 测试项目是否能够跑起来 导入项目中会遇到的jar包 jsp,Servlet,mysq|驱动, jstl, sta ...
- EXTJS项目实战经验总结一:日期组件的change事件:
1 依据选择的日期,加载相应的列表数据,如图: 开发说明 1 开发思路: 在日期值变化的事件中获得选择后的日期值,传给后台,然后从后台加载相应的数据 2 问题:在查看extjs2.2 的a ...
- Extjs 项目中常用的小技巧,也许你用得着(3)
几天没写了,接着继续, 1.怎么获取表单是否验证通过: form.isValid()//通过验证为true 2.怎样隐藏列,并可勾选: hidden: true, 如果是动态隐藏的话: grid.ge ...
随机推荐
- 构建一个基本的前端自动化开发环境 —— 基于 Gulp 的前端集成解决方案(四)
通过前面几节的准备工作,对于 npm / node / gulp 应该已经有了基本的认识,本节主要介绍如何构建一个基本的前端自动化开发环境. 下面将逐步构建一个可以自动编译 sass 文件.压缩 ja ...
- 百度MIP移动页面加速——不只是CDN
MIP是用CDN做加速的么?准确答案是:是,但不只是. MIP全称Mobile Instant Pages,移动网页加速器,是百度提出的页面加速解决方案.MIP从前端渲染和页面网络传输两方面进行优化, ...
- 在ASP.NET Core中使用百度在线编辑器UEditor
在ASP.NET Core中使用百度在线编辑器UEditor 0x00 起因 最近需要一个在线编辑器,之前听人说过百度的UEditor不错,去官网下了一个.不过服务端只有ASP.NET版的,如果是为了 ...
- SQL Server-聚焦NOT IN VS NOT EXISTS VS LEFT JOIN...IS NULL性能分析(十八)
前言 本节我们来综合比较NOT IN VS NOT EXISTS VS LEFT JOIN...IS NULL的性能,简短的内容,深入的理解,Always to review the basics. ...
- scala练习题1 基础知识
1, 在scala REPL中输入3. 然后按下tab键,有哪些方法可以被调用? 24个方法可以被调用, 8个基本类型: 基本的操作符, 等: 2,在scala REPL中,计算3的平方根,然 ...
- win10上部署Hadoop-2.7.3——非Cygwin、非虚拟机
开始接触Hadoop,听人说一般都是在Lunix下部署Hadoop,但是本人Lunix不是很了解,所以Google以下如何在Win10下安装Hadoop(之后再在Lunix下弄),找到不少文章,以下是 ...
- Kotlin类:功能更强、而更简洁(KAD 03)
作者:Antonio Leiva 时间:Dec 7, 2016 原文链接:http://antonioleiva.com/classes-kotlin/ Kotlin类尽可能简单,这样用较少的代码完成 ...
- ILJMALL project过程中遇到Fragment嵌套问题:IllegalArgumentException: Binary XML file line #23: Duplicate id
出现场景:当点击"分类"再返回"首页"时,发生error退出 BUG描述:Caused by: java.lang.IllegalArgumentExcep ...
- 归并排序的java实现
归并排序的优点不说了. 做归并排序之前,我先试着将两个有序数组进行排序,合并成一个有序数组. 思路:定义好两个有序数组,理解的时候我先思考了数组只有一个数组的排序,然后是两个元素的数组的排序,思路就有 ...
- 如玫瑰一般的PHP与C#混合编程
故事背景是这样的,有一套项目,服务器端是用C#写的,为了完成某种事情,它需要使用到一个组件,这个组件很小但很重要,很不巧的是,这个这个组件是用PHP语言写的,如果为了使用这个组件而专门搭建一个PHP的 ...