sencha touch 入门系列 (三)sencha touch 项目创建
通过上一章节的学习,我们的开发环境已经配置好了,接下来我们开始创建第一个sencha touch的项目,网络上很多sencha touch的教程都是手动搭建项目的,
不过手动搭建的项目缺少一些sencha cmd对项目代码打包压缩编译的关键文件,
所以在这里我们从创建项目开始都是使用sencha cmd工具,请确保上一章节中所有的环境配置都已经成功,
那么接下来我们开始我们的项目创建:
1.项目创建
在项目创建前,我们先确认下我们的sencha cmd的版本,
点击开始==》运行==》cmd,
键入sencha,会显示cmd的版本,
现在最新的是4.0,如果不是最新的版本,可以键入指令
sencha upgrade
该指令会自动从远程服务器上更新sencha cmd的版本,
确认版本更新完毕后,我们来创建一个新的项目,
用cmd创建sencha touch的项目需要在sencha touch的sdk包的环境下进行,我们有两种方式:
1.1 在sencha sdk包目录下进行创建
点击开始==》运行==》键入cmd,
一般默认显示是系统用户文件夹路径下,,
我的sdk包被我拷到了iis的站点文件夹下D:\webtest\touch-2.3.1,
所以这里我输入d:,然后回车,
cd D:\webtest\touch-2.3.1,
进入到sdk包目录下,如图:
这个时候,我们运行sencha cmd创建项目的指令
sencha generate app MyFirst ../MyFirst
generate app是创建一个新的项目,
第一个参数MyFirst对应的是项目的名称,
第二个参数../MyFirst对应是项目的输出地址,是相对路径,指向是cmd当前指定路径的上级目录,
有web开发经验的同学应该一眼就能看懂,
指令执行后,如图所示:
在不报错的情况下项目就创建成功了,
此时在我的D:/webtest目录下就会生成一个MyFirst项目文件,这就是我们新创建的sencha touch项目,
因为已经在服务站点路径下,如果生成的项目路径不在web服务站点路径下,可以把项目拷过去,
接着我们可以打开浏览器通过http://127.0.0.1/MyFirst/进行访问,
在等在文件载入完成后,我们便能看到我们第一个项目了,如图:
是不是很兴奋,你可以试着调整下浏览器的窗口大小,整个项目完全是响应式的,会根据你的窗口大小调整布局
有些人可能想直接点击新建项目下的index.html文件运行项目,此时页面会卡在载入界面并报如下错误:
这是因为cmd创建项目的时候,会生成一个bootstrap.json文件,这个文件的访问是在development.js中通过xhr的方式实现的
var xhr = new XMLHttpRequest();xhr.open('GET', 'bootstrap.json', false);xhr.send(null);
需要http请求,所以会报错,
不过整个项目完成后用cmd指令打包后,json文件都会被去掉,这个时候就不会出现该问题了,
接下来我们讲一下另一种创建方式
1.2 通过cmd指令直接指定sdk路径创建
该创建方式跟上一种大同小异,唯一的区别在于,不用先将指令指定到sdk包路径下了,我们可以直接用
<pre name="code" class="ruby">sencha -sdk D:\webtest\touch-2.3.1 generate app MyFirst D:\webtest\MyFirst
我们在generate app 前面加上了
<pre name="code" class="ruby">-sdk D:\webtest\touch-2.3.1
, -sdk后面跟的就是我们的sencha touch的sdk包的路径,这样执行上面的指令,跟我们方法一里的效果是一样的, 指令执行后,我们的MyFirst项目就被创建完成了
下一章我们将对生成的项目结构做系统的分析
sencha touch 入门系列 (三)sencha touch 项目创建相关推荐
- 机器学习入门系列三(关键词:逻辑回归,正则化)
机器学习入门系列三(关键词:逻辑回归,正则化) 目录(?)[+] 一逻辑回归 逻辑回归 假设表示 决策边界 代价函数 其他优化方法 多元分类 二正则化 一.逻辑回归 1.逻辑回归 什么是逻辑回归问题, ...
- Reflex WMS入门系列三十二:导出到Excel
Reflex WMS入门系列三十二:导出到Excel 如同SAP系统的风格 --- 凡是有list的界面,都能导出到Excel ---, Reflex WMS系统也提供了类似的功能.几乎在任何的Lis ...
- 小猪的C语言快速入门系列(三)
小猪的C语言快速入门系列(三) 标签: C语言 本节引言: 在上一节中,对C语言的基本语法进行了学习,类比成学英语的话,我们现在 只是会单词而已,组成一个个句子还需要学习一些语法,本节学习的就是两对 ...
- sencha touch 入门系列 (四)sencha touch 新建项目目录结构解析
通过上一章节的操作,我们的项目已经创建完成了, 大家通过http://127.0.0.1/MyFirst/应该都已经访问到了自己的应用, 接下来,我们展开我们项目,如图所示: 一.目录结构 1. .s ...
- sencha touch 入门系列 (七)sencha touch 类系统讲解(上)
在mvc结构的基础上,sencha touch又使用了sencha公司为extjs4开发出来的类系统,在面向对象的编程语言中,类是对对象的定义,它描述了对象所包含的大量属性和方法. 跟面向对象语言类似 ...
- sencha touch 入门系列 (二)sencha touch 开发准备
这是本人第一次写博客教程,没什么经验,文笔也不是很好,写这教程一方面为了巩固自己这段时间的学习成果,一方面帮助大家解决问题,欢迎大家多提建议,指出问题.接下来我们就开始我们的sencha touch开 ...
- 零基础数据挖掘入门系列(三) - 数据清洗和转换技巧
思维导图:零基础入门数据挖掘的学习路径 1. 写在前面 零基础入门数据挖掘是记录自己在Datawhale举办的数据挖掘专题学习中的所学和所想, 该系列笔记使用理论结合实践的方式,整理数据挖掘相关知识, ...
- sumo添加车辆_SUMO仿真快速入门系列三:产生车辆移动模型
在<SUMO快速入门系列二>中,我们已经产生了一个较为简单的街道地图模型. 本节中我们产生车辆移动模型并与道路模型结合,使得车辆在真实道路中跑起来.在SUMO中,车辆移动模型称为Deman ...
- SUMO仿真快速入门系列三:产生车辆移动模型
在<SUMO快速入门系列二>中,我们已经产生了一个较为简单的街道地图模型. 本节中我们产生车辆移动模型并与道路模型结合,使得车辆在真实道路中跑起来.在SUMO中,车辆移动模型称为Deman ...
最新文章
- KVM console 串口连接虚拟机
- 使用Open Liberty的开发模式最大程度地缩短周转时间
- Oracle12c异常关闭后启动PDBORCL(ORA-01033)
- oracle安装及卸载总结
- SQL SERVER 表最小行的一个纠结问题
- 【蓝桥杯单片机】NE555在CT107D上的使用
- 【Elasticsearch】Elasticsearch 分布式一致性原理分析:元数据
- 动态规划——Palindrome Partitioning II
- Linux驱动开发|WiFi驱动
- 大地高、正高和正常高及高程异常
- 几何画板椭圆九种画法_最全的几何画板绘制椭圆教程
- PCI-E x1/x4/x8/x16四种插槽区别是什么?具体有什么作用?
- windows 11系统提示windows许可证即将过期(仅限正版)
- oracle查看用户 同义词,oracle同义词
- QTP网管自动化测试框架
- set的用法及短语_set的短语
- js阿拉伯数字转中文数字
- 《文明6》引言科普 引言出处讲解 【转】
- 2023电工杯数学建模A题思路模型代码
- linux进程数和句柄数