Sencha CMD compiled file still downloading individual javascript files (touch 2.3.1)

Question

I have an existing Sencha Touch 2.3.1 MVC app that I want to compile to have a single concatenated javascript using Sencha CMD. With Sencha CMD I compiled out a bootstrap file and the single concatenated file that has all my javascript but when I run the app, I can see in Chrome inspector that the app is downloading individual javascript files.

This is the line I am using to compile my existing app to one file (not compressed at this point):

sencha -sdk /path/touch-2.3.1/src compile --classpath=. --options=debug:false include --all and exclude --file=lib,one_file.js and concatenate --output-file=one_file.js

This is what I am using to generate the bootstrap file:

sencha -sdk /path/touch-2.3.1/src compile -classpath=app meta -alias -out bootstrap.js and meta -alt -append -out bootstrap.js and meta -loader -append -base-path . -out bootstrap.js

Here is how my app.js look like:

Ext.application({
name: 'MyApp',
appFolder: 'app',
glossOnIcon: false,
paths: {
    'MyApp.ux': './app/ux',
    'Ext.override': './app/override'
},
requires: [
    'MyApp.Config',
    'MyApp.File'
],
viewport: {
    itemId: 'viewport'
},
stores: [
    'store1',
    'store2',
    // ...
    'store5'
],
models: [
    'model1',
    'model2',
    //...
    'model5'
],
views: [
    'MainContainer',
    'view1',
    'view2',
    //...
    'view9'
],
controllers: [
    'MainController',
    'LoginController',
    'AnotherController'
],
launch: function() {
    MyApp.app = this;
    Ext.create('MyApp.view.MainContainer', { fullscreen: true });
}

});

And finally this is how my index.html looks like:

    <!DOCTYPE html>
<html>
<head>    
<title>MyApp</title>
 <link rel="stylesheet" type="text/css" href="css/my-theme.css"/>    
 <link rel="stylesheet" type="text/css" href="style.css"/>
    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="lib/touch2/sencha-touch-all-debug.js"></script>      <script type="text/javascript" src="one_file.js"></script>
</head>
<body></body>
</html>

Your help will be highly appreciated. I spent many days to learn how to use Sencha CMD, got stuck at this point for a while. App runs fine but downloads individual javascript file.

OhmzTech OhmzTech · Accepted Answer · 2014-12-28T02:03:39

Don't start learning Sencha CMD by using "sencha compile". Instead use "sencha app build".

By default, a new project generated by Sencha CMD will be configured to generate several builds. The default is development, which can be done by running the command "sencha app build". However this doesn't really compile/minify/concat anything.

The two builds you care about are as follows:

"sencha app build testing" - will compile a generated build where all Sencha files/class and additional/external JS (per configuration in app.json) are combined into one file. The resulting file, app.js, is not minified for debugging purposes.

"sencha app build production" - will compile the same as above, except all of app.js (as well as style/theme) will be minified.

Sencha CMD compiled file still downloading individual javascript files (touch 2.3.1)

1 Answers