美文网首页程序员
ExtJS 6.2 基础使用

ExtJS 6.2 基础使用

作者: 小炉炉 | 来源:发表于2018-01-23 11:18 被阅读288次

一、 安装:

下载两个压缩包:分别是

ext-6.2.0-gpl(这个是Extjs 的sdk文件,创建新项目的时候需要用)。

SenchaCmd-6.5.2-windows-64bit (这个下载下来是解压,或者不解压。反正最后看到的是一个.exe 结尾的安装文件 ,直接安装运行即可PS:一定要记住安装到哪个文件夹下面了)

二、 运行:

安装好SenchaCmd-6.5.2-windows-64bit.exe 之后,点击Windows的命令提示窗 image.png

进入到提示窗中:

使用cd 命令进入刚才 SenchaCmd-6.5.2-windows-64bit.exe 安装的那个文件夹中,我的路径是:C:\Users\win7\bin\Sencha\Cmd

效果如下:


image.png

命令行提示符如下:


image.png

在此驶入sencha help 可以查看命令相关的提示信息(有点与javac 之后出现的那些东西类似)。

三、 创建第一个项目:

创建项目首先得找到ext-6.2.0-gpl 的解压路径如下图所示

image.png

然后在刚才打开的那个命令行中,切记一定是在C:\Users\win7\bin\Sencha\Cmd 也就是说在SenchaCmd-6.5.2-windows-64bit.exe 的安装路径下运行如下语句,创建第一个demo项目。

创建语句如下:

sencha -sdk [解压后的ext-6.2.0的位置] generate app [项目名称] [项目地址]

image.png

第一个红圈是刚才解压的ext-6.2.0-gpl 文件路径 ,第二个红圈是你要生成的demo的路径

image.png

但是很显然,我这个生成的太乱了所以我决定在此创建一下,这回我单独在创建一个项目文件夹来保存生成的这些文件。

image.png

再次创建的情况如上。当出现如下画面的时候,就表示已经完成了demo****的创建。

image.png

那么新创建的demo****目录则如下图所示:

image.png

四、 运行demo:

此时进入新建好的项目文件夹中运行 sencha app watch 即可运行。但是此时会出现如下问题(我所遇到的)

image.png

这很明显是因为cmd的命令没有添加到path环境变量中,导致sencha命令无法再全局使用(一般情况下,会在安装cmd的时候直接把命令添加到path中,但是不知道为什么我的不行,所以需要手动添加)。所以需要把之前的cmd****的安装路径添加到path中,如何添加我就不说了,安装过java的都应该知道怎么添加。

C:\Users\win7\bin\Sencha\Cmd------》此路径添加到path环境变量中。即可在生成的demo文件夹下运行sencha app watch 如上图所示

image.png

打开浏览器输入:localhost:1841(如果1841****端口号占用,会自动变成其他的端口号,留意里面的提示就好),即可查看默认生成的项目

image.png

此时,一个完整的demo就展现在眼前了。
当你看完上面的东西,再看我下面的内容,就一目了然了。
以下内容来自博客:http://blog.csdn.net/onightfalls/article/details/76520868

第一步:

首先确认系统已经安装jdk并配置好环境变量。

第二步:

下载 Sencha Cmd安装文件,地址:https://www.sencha.com/products/extjs/cmd-download/

第三步:

配置环境变量,进入环境变量 -> 系统变量 -> Path -> 追加D:\Program Files\Sencha\Cmd;(即: sencha cmd 安装路径)

第四步:

本地下载Extjs依赖ext-6.2.0-gpl.zip, (下载地址及方式自行百度)

最后一步: 生成项目

C:\Users\Administrator>sencha -sdk D:\Sencha\ext-6.2.0 generate app -classic MyApp D:\Sencha\workspace\admin

相关文章

  • ExtJS 6.2 基础使用

    一、 安装: 下载两个压缩包:分别是 ext-6.2.0-gpl(这个是Extjs 的sdk文件,创建新项目的时候...

  • ExtJS 使用感悟

    前言 各位前辈在上小弟拱礼,小弟唤作查查,何为查查,与渣渣者无水矣,意在小弟虽初出茅庐然已成自我,自认非渣渣尔,然...

  • ExtJs layout布局介绍

    ExtJs layout布局介绍 ExtJs是一个大而全的框架,页面布局主要使用js来进行控制。为了能更高效方便的...

  • Sencha Cmd使用指南

    查看Cmd版本 使用 sencha 命令查看当前cmd版本信息 显示如下 使用Sencha Cmd创建Extjs ...

  • Sencha ExtJS5.x的类系统讲解

    ExtJS5拥有许许多多的类,到目前为止使用ExtJS开发的人员有200多万,他们来自不同的地域,拥有不同的背景。...

  • 基于Extjs 6.2 admin-dashboard 模板创建

    测试环境 Extjs: version.release=6.2.0 Extjs目录: D:\ext6工作目录:...

  • extjs

    http://extjs.org.cn/node/125中文extjs网站

  • Excel实战:累计求和

    本篇适合:有一定公式基础者。 如图-1,需求是累计求和,其逻辑为: 6.1累计=6.1 6.2累计=6.1+6.2...

  • Xcode6.2中使用Masonry的出现的问题

    在Xcode6.2中使用首先导入“Masonry.h”包。 ps1:在xcode6.2中,只能使用 make_Co...

  • ExtJs4 API文档

    ExtJs_v4.1.0 zh-CN ExtJs_v4.2.0 en-US

网友评论

    本文标题:ExtJS 6.2 基础使用

    本文链接:https://www.haomeiwen.com/subject/tlfsaxtx.html