I am new to Ext JS. I have:
Sencha Cmd 4.0.0.203
Extjs 4.2.1.883
SenchaSDKTools-2.0.0-beta3
Ruby193
I read the Ext JS documentation on the hello world example man page here:
http://docs.sencha.com/extjs/4.2.1/#!/guide/getting_started
So, I created a folder called helloext in the webapp of my Tomcat and placed the contents of ext-4.2.1.883 in extjs inside it and the app.js file next to this folder with this content:
Ext.require('Ext.container.Viewport');
Ext.application({
name: 'HelloExt',
launch: function() {
Ext.create('Ext.container.Viewport', {
layout: 'fit',
items: [
{
title: 'Hello Ext',
html : 'Hello! Welcome to Ext JS.'
}
]
});
}
});
Finally, I created index.html with this content:
<html>
<head>
<title>Hello Ext</title>
<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css">
<script type="text/javascript" src="extjs/ext-debug.js"></script>
<script type="text/javascript" src="app.js"></script>
</head>
<body></body>
</html>
So my packaging structure:
- helloext
- app.js
- index.html
- ExtJS (folder)
That extjs (folder) contains all the contents of ext-4.2.1.883.
When I enter this address http://localhost:8080/helloext/index.htmlin the address bar of the browser, everything is in order.
When executing the commands below:
sencha create jsb -a index.html -p app.jsb3
sencha build -p app.jsb3 -d .
I got this message, it seems everything is in order and done!
D:\application server\apache-tomcat-7.0.41\webapps\helloext>
sencha create jsb -a index.html -p app.jsb3
D:\application server\apache-tomcat-7.0.41\webapps\helloext>
sencha build -p app. jsb3 -d .
Loading the Project Name Project
Loaded 0 Packages
Loaded 2 Builds
* Parse all-classes.js with options:
- debug: true
- debugLevel: 1
* Parse app-all.js with options:
- debug: false
- debugLevel: 1
* Compress and obfuscate app-all.js...
Copy resources...
Done building!
D:\application server\apache-tomcat-7.0.41\webapps\helloext>
jsb3, :
all-classes.js
and
app-all.js
:
all-classes.js: . , . , Hello Ext .
app-all.js: Ext JS, . all-classes.js + app.js.
:
all-classes.js 2,39
-all.js abub 500 .
index-prod.html :
<html>
<head>
<title>Hello Ext</title>
<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css">
<script type="text/javascript" src="extjs/ext.js"></script>
<script type="text/javascript" src="app-all.js"></script>
</head>
<body></body>
</html>
URL-:
http:
, Firefox Chrome ???
Firefox:
TypeError: Ext.cmd is undefined
TypeError: Ext.EventManager is undefined
Chrome:
Uncaught TypeError: Cannot call method 'derive' of undefined
(anonymous function)
Uncaught TypeError: Cannot call method 'onWindowResize' of undefined app-all.js:4
Ext.define.constructor app-all.js:4
i ext.js:21
(anonymous function) app-all.js:4
Ext.ClassManager.processCreate ext.js:21
Ext.ClassManager.processCreate ext.js:21
(anonymous function) ext.js:21
Ext.apply.onBeforeCreated ext.js:21
Ext.apply.doProcess ext.js:21
Ext.apply.process ext.js:21
Ext.Class.c ext.js:21
Ext.ClassManager.create ext.js:21
Ext.apply.define ext.js:21
(anonymous function)
?
.