EXT JS 5.1 Minified Core Frame work when developing

Question

When developing I want to use a a minified .js file of Ext JS 5.1 like they do on Sencha Fiddle. It looks like you can use the cdn link from Sencha but when I use this in the index file it fails.

Is there something I need to be doing in the bootstrap.js file to make it use just a link instead of the Ext Js 5 root folder? I want to use the same link for multiple apps hosted on a server for an enterprise situation.

Also, the Chrome Dev Tools running super slow having to load each file. I want to use one minified file to make this useful again.

weeksdev weeksdev · Accepted Answer · 2015-01-16T22:37:40

I'm not positive how you could use the cdn file referenced in the sencha fiddle website. Adding that link directly to the app while using the microloader would cause errors. The microloader in extjs5 automatically figures out which files to load in the framework.

However, you can achieve a similar goal of using a minified version of the extjs framework if you are using sencha cmd.

They detail how to setup your project to use the minified or developer copy of extjs5 instead of loading all the seperate files in this forum post

Here are the changes to make to your project documented to stack overflow in case that forum post is no longer available:

Step One

make sure you are using a version of sencha cmd greater than 5.0.2.
To determine your version of sencha cmd you can type the following in the command prompt:

sencha which

If you have an older version of sencha cmd you can download the latest copy here

Thanks to Niederee for this little advice, do a sencha app upgrade on your app to make sure it's tied to the latest sencha command build

sencha app upgrade

Step Two

Adjust your app.json manifest file to load the ext-all-rtl-debug.js . Add this file to the "js":[] array in the file:

"js": [
        {
            "path": "${ext.dir}/build/ext-all-rtl-debug.js"  // new default for generated apps
        },
        {
            "path": "app.js",
            "bundle": true
        }
    ],

You can also add sencha charts if they are required to get that minified build too:

        {
            "path": "${ext.dir}/packages/sencha-charts/build/sencha-charts-debug.js"
        },

Optionally you can also adjust the cache preferences based on dev/production Add this additionally to the app.json file:

"development": {
        "loader": {
            "cache": true
        }
    },
    "production": {
        "loader": {
            "cache": "${build.timestamp}"
        }
    }

Step Three In the command prompt run the following sencha command to refresh your application's bootstrap manifest.

sencha app refresh

EXT JS 5.1 Minified Core Frame work when developing

1 Answers