Search code examples
extjssencha-cmd

Merging multiple separate universal application to one Main App

Our application should have a main app and is consists of multiple modules and these modules have their own git repository.

The goal is to use the main app and turn the modules into packages that should only be referenced or called in the main app. Just like a DLL in C# or a component in Angular.

Now, I have looked thru sencha docs and all I can see is consolidating the modules into one single directory/workspace. We don't want to go that way because the modules have their own repo and the "main app" will also have its own repository.

Please recommend the best path to take.

Solution

  • I guess the simplest way is to define the workspace for the package inside each repo by adding this as workspace.json:

    {
  "frameworks": {
    "ext": "ext"
  },
  "build": {
    "dir": "${workspace.dir}/build"
  },
  "packages": {
    "dir": "${workspace.dir}/packages/local,${workspace.dir}/packages",
    "extract": "${workspace.dir}/packages/remote"
  }
}

    Now you need to link (symlink suggested) or copy the framework under /ext

    Lets say you have the following structure

    /root/workspace.json
/root/ext
/root/packages/local/yourModule

    Now you can go to /root/packages/local/yourModule and call

    sencha package build

    This should produce the package and js-files.

    You will find the js files under

    /root/packages/local/yourModule/build/yourModule.js
/root/packages/local/yourModule/build/yourModule-debug.js

    These files can now be loaded on demand from your main app.

    Depending on your needs you can optimize the build by adding

    skip.sass=1 
skip.examples=1
skip.slice=1
skip.pkg =1

    in your package.json - or for legacy sencha cmd packages inside

    /root/packages/local/yourModule/.sencha/sencha.cfg

    A different approach could be by using another build tool.

    You need to do inside:

    /root/packages/local/yourModule/src

    • (put the files in the right order)
    • concat
    • remove whitespace *
    • uglify *

    star means only relevant for the debug version of your module (package).

    This is more less what a standard sencha cmd package build does.

    I tried it successfully with grunt.