通过上一章节的学习,我们的开发环境已经配置好了,接下来我们开始创建第一个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包路径下了,我们可以直接用

  

   sencha -sdk D:\webtest\touch-2.3.1 generate app MyFirst D:\webtest\MyFirst

     我们在generate app 前面加上了

    -sdk D:\webtest\touch-2.3.1,

    -sdk后面跟的就是我们的sencha touch的sdk包的路径,这样执行上面的指令,跟我们方法一里的效果是一样的,

    指令执行后,我们的MyFirst项目就被创建完成了

  

     下一章我们将对生成的项目结构做系统的分析

 

    

    

sencha touch 入门系列 (三)sencha touch 项目创建的更多相关文章

  1. sencha touch 入门系列 (九) sencha touch 布局layout

    布局用来描述你应用程序中组件的大小和位置,在sencha touch中,为我们提供了下面几种布局: 1.HBox: HBox及horizontal box布局,我们这里将其称为水平布局,下面是一段演示 ...

  2. sencha touch 入门系列 扩展篇之sencha touch 项目打包压缩

    经常有新手同学抱怨说sencha touch的项目加载速度为什么这么慢,经常要10秒左右的时间甚至更多, 大家都知道,sencha touch开发的项目中引用了大量的js文件,当我们打开项目时,st的 ...

  3. mybatis入门系列三之类型转换器

    mybatis入门系列三之类型转换器 类型转换器介绍 mybatis作为一个ORM框架,要求java中的对象与数据库中的表记录应该对应 因此java类名-数据库表名,java类属性名-数据库表字段名, ...

  4. C# 互操作性入门系列(三):平台调用中的数据封送处理

    好文章搬用工模式启动ing ..... { 文章中已经包含了原文链接 就不再次粘贴了 言明 改文章是一个系列,但只收录了2篇,原因是 够用了 } --------------------------- ...

  5. [转]C# 互操作性入门系列(三):平台调用中的数据封送处理

    参考网址:https://www.cnblogs.com/FongLuo/p/4512738.html C#互操作系列文章: C# 互操作性入门系列(一):C#中互操作性介绍 C# 互操作性入门系列( ...

  6. sencha touch 入门系列 (四)sencha touch 新建项目目录结构解析

    通过上一章节的操作,我们的项目已经创建完成了, 大家通过http://127.0.0.1/MyFirst/应该都已经访问到了自己的应用, 接下来,我们展开我们项目,如图所示: 一.目录结构 1. .s ...

  7. sencha touch 入门系列 (七)sencha touch 类系统讲解(上)

    在mvc结构的基础上,sencha touch又使用了sencha公司为extjs4开发出来的类系统,在面向对象的编程语言中,类是对对象的定义,它描述了对象所包含的大量属性和方法. 跟面向对象语言类似 ...

  8. sencha touch 入门系列 (二)sencha touch 开发准备

    这是本人第一次写博客教程,没什么经验,文笔也不是很好,写这教程一方面为了巩固自己这段时间的学习成果,一方面帮助大家解决问题,欢迎大家多提建议,指出问题.接下来我们就开始我们的sencha touch开 ...

  9. ActiveMQ入门系列三:发布/订阅模式

    在上一篇<ActiveMQ入门系列二:入门代码实例(点对点模式)>中提到了ActiveMQ中的两种模式:点对点模式(PTP)和发布/订阅模式(Pub & Sub),详细介绍了点对点 ...

随机推荐

  1. openwrt使用list

    openwrt中用到双向无头链表,实际应用时应在外部定义实体链表头,后续可直接应用链表函数(宏定义已将链表头排除在外): static struct list_head timeouts = LIST ...

  2. .net提供的5种request-response方法一

    .net提供了三种基本方法和两种底层方法来发送http请求和接收http响应,通过这些方法,我们可以模仿在浏览器地址栏输入URL地址访问网页的方法.我们发送http请求,接收服务器返回的响应(通常就是 ...

  3. 也谈谈js的压缩,jquery压缩。【转】

    问题缘由: 负责公司的开发平台研发工作,考虑的知识产权的保护工作,必须要考虑java的加密技术和js脚本的加密技术.在目前java加密很容易破解的情况下,还是先搞定js的加密和压缩,一方面可以提高页面 ...

  4. Linux之查看文件大小和数目

    1.查看当前文件大小du -sh ./ du [-abcDhHklmsSx] [-L <符号连接>][-X <文件>][--block-size][--exclude=< ...

  5. 使用ffmpeg实现合并多个音频为一个音频的方法

    使用ffmpeg实现合并多个音频为一个音频的方法可以使用ffmpeg的filter功能来进行这个操作,而且效果很好amerge也可以实 使用ffmpeg实现合并多个音频为一个音频的方法 可以使用ffm ...

  6. div盒子的居中

    <html> <title>XXXX</title> <meta charset="utf-8" /> <style type ...

  7. apk 反编译工具的使用

    在学习android 开发的时候,我们经常回尝试使用到别人的apk,希望能了解别人怎么编写的代码,于是想要一个能实现其反编译的软件,将软件反编译出来,查看其代码. 工具/原料 反编译软件dex2jar ...

  8. 编写Unity3D着色器的三种方式

    不管你会不会写Unity3D的shader,估计你会知道,Unity3D编写shader有三种方式,这篇东西主要就是说一下这三种东西有什么区别,和大概是怎样用的. 先来列一下这三种方式: fixed ...

  9. 如何使用matlab中的胞元数组

    胞元数组(cell Arry)的基本组分是胞元(cell),每个胞元本身在数组中是平等的,只能以下标区分.胞元可以存放任何类型.任何大小的数组,如任意维数值数组.字符串数组.符号对象等,而且同一个胞元 ...

  10. ubuntu 16.04 appstreamcli 问题

    http://blog.csdn.net/zhbpd/article/details/77508675