Properly using the 'overrides' folder generated by Sencha Cmd for Ext Js 4.2

[FoxMulder900]

I have generated a new app using Sencha Cmd which creates the following directories:

+app
+ext
+overrides
+packages
+resources
+sass

I have added my overridden Ajax.js file inside the overrides directory and added this line to my app.js file:

requires: [ 'overrides.Ajax' ]

However I get the following error when I try to build the app using Sencha Cmd.

[ERR] BUILD FAILED[ERR] com.sencha.exceptions.BasicException: The following error occurred while executing this line:[ERR] Z:\public_html\LoginScreen\.sencha\app\build-impl.xml:469: com.sencha.exceptions.ExBuild: com.sencha.exceptions.ExBuild: Failed to find any files for Z:\public_html\LoginScreen\app\app.js::ClassRequire::overrides.Ajax

Everything works as expected when testing the app, it just seems that Sencha Cmd doesn't know where to look for the necessary files. Is there something I am missing to properly include my override?

[mitchellsimoens]

You need to add the overrides directory to the .sencha/app/sencha.cfg. Look for the app.classpath and add this (it's a comma-delimited value):

,${app.dir}/overrides

[FoxMulder900]

That did it! Thanks a lot Mitchell!

[mmls]

Mitchell, thanks for the solution, I had the same problem.

As a suggestion, when a skeleton app is generated, because the overrides folder is created as part of the skeleton, it would be good if the path could be added to the config file by default.

Thanks.

[LesJ]

You need to add the overrides directory to the .sencha/app/sencha.cfg. Look for the app.classpath and add this (it's a comma-delimited value):

,${app.dir}/overrides

I faced the same problem and your response was helpful, but I must ask the obvious question...

Why the app.classpath config doesn't contain the extra info since many developers create overrides?

[dongryphon]

Great question!

The overrides folder is used to hold things (typically overrides) that are automatically required. This was introduced for theme packages like Neptune that had JavaScript injections needed but we didn't want user code to have to require them by name ... beyond specifying the theme that is.

These are brought in by the app.js line:

// @require @packageOverrides

As this seemed a useful thing for apps, we recently added "overrides" for apps as well (Cmd 3.1.2 probably). But these got tagged as "appOverrides" and app.js did not get updated accordingly. We'll fix that in the next spin of Cmd, but the fix is to change the above to this:

// @require @packageOverrides
// @require @appOverrides

[Gordonh]

Hi There-

Using Cmd 3.1.2.342, placing just the // @require @appOverrides in the app.js didn't do anything to the build process. I added overrides to the app.classpath and that worked fine.

Regards,
Gordon

[dongryphon]

The use of overrides is two parts - add an override to folder; use the class that the override targets.

If you add this to your app's overrides folder (and have the @requires I mentioned):

Ext.define('App.overrides.Panel', {  // actual name here is not important
    override: 'Ext.panel.Panel',  // assuming you app uses a Panel (pretty much a given)

    foo: 42
});

Then check your panels for a foo property.

If the file you put in overrides is just a normal class then it will be automatically required in to your build.

In dev mode these files should be added to bootstrap.js as dynamically loaded scripts.

If this is not working as I am describing it, I would really appreciate some details to help get to the bottom of it.

Thanks!

[mlitcher]

Here is what I've tried (using Cmd 3.1.2.342).

Created skeleton app using Cmd and put override in overrides folder:

Panel.js

Ext.define("App.overrides.Panel", {
    override: "Ext.panel.Panel",
    foo: 42
});

Added @require to app.js

/*
    This file is generated and updated by Sencha Cmd. You can edit this file as
    needed for your application, but these edits will have to be merged by
    Sencha Cmd when upgrading.
*/

// DO NOT DELETE - this directive is required for Sencha Cmd packages to work.
//@require @packageOverrides
//@require @appOverrides

Ext.application({
    name: 'Test',
    extend: 'Test.Application',
    autoCreateViewport: true
});

Is that all that is needed? If I run "sencha app build", should bootstrap.js get updated with an entry for this override? I don't see the override getting loaded.

[dongryphon]

The override should be included in your app's all-classes.js by sencha app build but to update the bootstrap.js file you need to run:

  sencha app refresh

Just to check - this is Ext JS right?

Coming with Cmd v4 is some streamlining here as well as support for bootstrap.js in Touch. In v4, sencha app build and sencha app watch both maintain the boostrap file. Also, the extra @require statements won't be needed... so this will get a bit easier in the next release. If you want to try the v4 beta, check out:

http://www.sencha.com/forum/showthre...-Now-Available