Error : The following classes are not declared even if their files have been loaded" after deploying sencha touch application

Question

Uncaught SyntaxError: Unexpected token < sencha-touch.js:8618

Uncaught Error: The following classes are not declared even if their files have been loaded: 'Ext.Title'. Please check the source code of their corresponding files for possible typos: 'touch/src/Title.js at Object.onFileLoaded (sencha-touch.js:8618) at Object. (sencha-touch.js:3267) at HTMLScriptElement.onLoadFn (sencha-touch.js:8275)

Answer 1

The first error says that a certain file has been loaded but did not contain the expected JSON or JavaScript. Instead, the file contains HTML or XML.

The second error says that the file touch/src/Title.js does not contain Ext.define('Ext.Title', ...).

These two errors occur in that succession if the following holds:

• your application somewhere uses Ext.Title,
• you didn't add Ext.Title to your requires section,
• the file touch/src/Title.js does not exist in the application directory and
• the web server delivering your application delivers an HTML error page if a file is not found.

Your application will try to load the file touch/src/Title.js only if the definition (Ext.define('Ext.Title') is not compiled into app.js.

Usually, the underlying issue is that you are missing a requires directive in a file. The requires directives are evaluated at compile time and the components added to app.js, so your app won't try to load Title.js at runtime. If you add the requirement to the component that uses it:

Ext.define('MyOwnComponent',{
    requires: ['Ext.Title'], // <- add it here
    constructor: function() {
        Ext.create('Ext.Title'); // <- if it is used e.g. here
    }
});

and compile your app again, you should be good to go. If you don't know where it is used, you can add it to your Application.js, which also has a requires section:

Ext.define('MyApplication',{
    extend: 'Ext.app.Application',
    requires: ['Ext.Title'], // <- add it here
    stores:[],
    ...
});