How can I build production by Ext JS 5 app, but keep separate the Ext JS library?

[SebTardif]

To improve caching between applications. I would like to keep separate the Ext JS library from my built code.

Mainly, my production index.html will looks similar to:

<script type="text/javascript" src="ext-all.js"></script>
<script type="text/javascript" src="MyApp-all.js"></script>

How do I easily get that result from: sencha app build production ?

[dongryphon]

We have discussed "multi-app" aware builds, but there is no direct support for that at present, so while you could coax Cmd into splitting its output along these lines, the framework content would be effectively app-specific.

Or perhaps you are intending to use "ext-all.js" (literally) and not the subset Cmd determined as actually needed? That would mean you just want Cmd to concat / optimize the files of each app and each would then load 100% of the framework?

If so, it would be interesting to see if the increase in size of ext-all vs only what each app needs would actually be a benefit to total load time...

[SebTardif]

I want the original ext-all.js, then sencha cmd could compress and optimize the code of app only.

[dongryphon]

There is an Ant property called "build.operations" which you can define that is injected just prior to Cmd saving the set of files it determines are needed by your app. These are the files that will be concatenated into the build/app.js file.

I added this to build.xml since multi-line properties are much cleaner in this file then in a .properties file:

    <target name="-before-init">
        <property name="build.operations">
            exclude
                -all
            and
            include
                -namespace=App
        </property>
    </target>

This will only keep your app code by using its namespace name (a white-list). In more complex scenarios you might need to exclude only specific things (a black-list). This will exclude only the core and ext packages:

    <target name="-before-init">
        <property name="build.operations">
            exclude
                -tag=package-sencha-core
                -tag=package-ext
        </property>
    </target>

You didn't mention the theme you are using but that will come into play because themes have JavaScript overrides. To exclude the Neptune theme as well (if you plan to also include its all.js file):

    <target name="-before-init">
        <property name="build.operations">
            exclude
                -tag=package-sencha-core
                -tag=package-ext
                -tag=package-ext-theme-neptune
        </property>
    </target>

If you do an A/B test on this I would love to hear your results of "cache benefit" using this approach vs "less code to execute" using the stock app build.

[bogc]

@SebTardif: I know it's almost 3 years later, but I am interested in the same thing in Ext Js 6. What did you end up doing?

The solution proposed by dongryphon works for me, though the build time still takes as long as a normal build that includes just dependencies.

[bogc]

I used this command to concatenate my app files:

sencha compile -classpath=app,app.js exclude -namespace=Ext and concat app-all.js