I have a simple universal app, which works just fine when tested using
sencha app watch
However, when i prepared a production/testing build version using
sencha app build testing/production
and tested it on a webserver, the errors started to come.
For example, the modern toolkit version has a form with passwordfield within and the error whown during the view instantiation is:
Uncaught Error: [Ext.createByAlias] Unrecognized alias: widget.passwordfield
Alternatively, the classic toolkit version has a simple container with layout: 'center' and the error here is:
Uncaught Error: [Ext.createByAlias] Unrecognized alias: layout.center
All this is very annoying, because it works just fine on sencha app watch.
Any ideas how to investigate this?
I'm pretty sure it is related to some sencha cmd configurations, but i have no way to find out where the problem is.
1.Try to use alias:'widget.x' and make sure that the file is included also Just try to add them to requires of your main view.
Whenever you are creating a instance of an object using xtype within an items array, that same class must have the fully qualified name of the class that defines that xtype.
This one might help you, refer this link:
Uncaught Error: [Ext.createByAlias] Cannot create an instance of unrecognized alias: widget
2.This is because you are using layout:'center' , without adding the layout to the requires section.'Ext.layout.container.Center' to your requires section and run the appplication.
requires:[
'Ext.layout.container.Center'
]
Refer this link:
Build the application: Error: [Ext.createByAlias] Unrecognized alias: layout.center
Related
We have an ExtJS modern app. We would like to use cmd to minimize/compress our code into a single .js file - effectively doing what a non Ext app would do with other minifiers like uglifyjs or terser.
I believed we could achieve this with the compile command such as:
sencha -sdk ext-7.1.0.46 compile -cl=myclassfolder -inp=ES6 concat outfile.js
However, it complains that it can't find the Ext classes with an error like:
[ERR] Failed to resolve dependency Ext.data.Model for file myapp.model.mymodel
[ERR] Unknown definition for dependency : Ext.data.Model
It seems to be the basic task of extending Ext.data.Model it doesn't like and very much feels like I simply need to reference the extJS class structure correctly for this to work, but can't figure out the command line to make it happen (I somewhat assumed that the sdk reference would fix this).
Is this possible?
Ok, to help anyone who is facing the same problem and wants to compress/minify their ExtJS but without creating a full sencha app.
The command is fairly simple and the answer is to include the path to your dependent js files in the -cl (or -classpath) argument, then exlude the Ext namespace:
sencha -sdk stack/Sencha/ext-7.2.0 compile -cl=ext-modern-all.js,packages/ux/modern/ux.js,myclassfolder -inp=ES6 exclude -namespace Ext and concat outfile.js
You can then use terser or your preferred minify tools to minify/mangle the output (or add the compress command to the above to allow cmd to minify also). It's a reasonable way to build your ExtJS code into several manageable extjs "modules" which can be loaded when needed (or when security allows) rather than the "big bang" approach of cmd.
This will produce a single js file, correctly ordered, the only issue is that it includes the Ext microloader code, which it adds by default. I have not managed to have the compiler not inlcude the microloader, however you can effectively disable it by defining the microloader yourself between the load of your ext-all.js file and your newly created file by using something like this is another file or inline script tag:
Ext.Microloader = {
run: function(){}
};
I know there aren't many folks left using ExtJS, hope this helps someone at some point, at worst case it allows a bit more control of the ExtJS build process.
I am having Extjs6 App. I am using Sencha Architect for UI . When I am building web using build setting , testing build was getting following error after build is done and onclick of my index.html.
Uncaught Error: [Ext.createByAlias] Unrecognized alias: interaction.itemhighlight
at Ext.Inventory.instantiateByAlias (app.js:13520)
at Object.factory (app.js:7711) at constructor.applyInteractions (app.js:213699)
at constructor.setter [as setInteractions] (app.js:9056)
at constructor.addItemHighlight (app.js:206608)
at constructor.updateTooltip (app.js:206589)
at constructor.setter [as setTooltip] (app.js:9062)
Please help me to resolve this error.
Regards
This will be due to not requiring a class that you use, in development they are loaded dynamically.
To figure out what class is missing, you should run sencha app build testing which will not minify the code, and your error message will be more meaningful.
I had a similar issue, the problem seems to be that sencha is not importing the library when is creating the production or testing builds, you should add the library you are missing in "requires" section of the view that uses it in this case i think the library is 'Ext.chart.interactions.ItemHighlight' after this all your builds should work properly because sencha now knows that it needs this library in the build.
Sorry for my english, hope it helps.
I am using sencha sdk tool 2 to build my extjs 4 application. Build is working fine and it generated two files -
app-all.js - minified
all-classes.js - non-minified
But when I am using minified app-all.js with ext.js in my index-mini.html page it is not working and giving me the error "Cannot read property 'get' of undefined" at Ext.util.Cookies.get()
My application is working fine when I am using ext-all.js instead of ext.js.
I saw that my application is using some util classes(like - Ext.util.Cookies) that are not present in ext.js. Also for development we are using ext-all.js in our index.html but for deployment we want to use ext.js.
Questions -
How can I run my application using ext.js & app-all.js?
-
Thanks in advance.
The problem is that ext-all.js (and the un-minified ext-debug.js) only provide the minimum number of core ExtJS classes needed to get up and running. Any additional classes should be dynamically loaded as separate files
Section 2.2 of Getting Started describes this, and also explains that you should dynamically load any additional classes.
Basically, you need to include a requires statement in your application as shown below.
requires:[
'Ext.util.Cookies'
],
edit
I used cake bake to make a new plugin and behavior (using --plugin) and it worked. Not sure what I missed.
I'm trying to load the behavior of a plugin. I'm trying to do this with a plugin I wrote for my own use, but I get the same problem when trying to load someone else's.
For example loading https://github.com/Xety/Cake3-Upload
I know you should normally use composer, but this is the way I would load my own plugin.
copy the plugin to \app\plugins\Cake3Upload
load the plugin in bootstrap.php using
Plugin::load('Cake3Upload', ['autoload' => true]);
access the behavior in my model's MyModelTable.php initialize function
$this->addBehavior('Cake3Upload.Upload');
I then get the following error:
Missing Behavior
Cake3Upload.UploadBehavior could not be found.
Make sure your plugin was loaded from config\bootstrap.php and
Composer is able to autoload its classes, see Loading a plugin and
Plugins - autoloading plugin classes
Error: Create the class UploadBehavior below in file:
\app\plugins\Cake3Upload\src\Model\Behavior\UploadBehavior.php
use Cake\ORM\Behavior;
class UploadBehavior extends Behavior
{
}
And what about namespaces ? If u wont use composer u must build the same files tree.
I think it's just about the uploadBehavior have this namespace:
namespace Xety\Cake3Upload\Model\Behavior;
then u only have to follow the plugin doc:
Plugin::load('Xety/Cake3Upload');
and
$this->addBehavior('Xety/Cake3Upload.Upload');
Add 'Xety/' maybe
I am new to Sencha Touch and Sencha Command. I downloaded the requisite tools to build a Sencha Touch app. When I use the following command in Sencha Command, the app is generated fine but when I try to access it using the browser I see only the loader.
sencha -sdk touch-2.3.1 generate app MyApp ./MyApp
When viewed on Firefox, it shows following errors in the console.
TypeError: Ext.Loader is undefined bootstrap.js: 7
TypeError: Ext.application is not a function app.js: 50
On some investigation, I found that it is looking for the above mentioned files in a directory named touch directly under http://localhost/. Whereas I have Sencha framework and my app under http://localhost/sencha/touch-2.3.1 and http://localhost/sencha/MyApp.
Some files under MyApp directory have the path mentioned to touch directory as ../../../../touch. If I copy the framework in http://localhost/touch it works fine.
Why should this happen? Shouldn't my app refer to http://localhost/sencha/touch-2.3.1 folder for dependencies?
I am using the default configuration to build a default application. Can someone guide me what I might be doing wrong?
Sencha Cmd assumes that your app runs at the root of the web server... so if you're running it from a subfolder, you might see problems like this.
You can set the correct paths manually to your resources in app.js
//at the very top, before Ext.appliction()
Ext.Loader.setConfig({
enabled: true,
paths: {
'Ext' : '../touch',
'My' : 'app' //or wherever
}
});
I think that should solve your problem, if I understand it correctly.