2

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.

computerandcoffee
  • 53
  • 7
  • Maybe packages are what you're looking for: https://docs.sencha.com/cmd/guides/cmd_packages/cmd_creating_packages.html – Merlin Attila Fejzuli Dec 02 '20 at 05:36
  • Hi @MerlinFejzuli, that's the one I am looking into now. From what I understand, cmd packages only work if you have a sencha workspace, from there you can share codes. In my case, I want to just simply add the modules like a "package" without adding the project itself on the main app. Again, the Main app will have its own repository. More likely I want to keep it loousely coupled. – computerandcoffee Dec 02 '20 at 05:57
  • You can host your created packages. You could then require them in your app. This would ofcourse download them to the packages folder, but you can .gitignore that (if you're using git, there are still some svn people *shiver*) to not have it in your repository. I don't think that a workspace is necessary. – Merlin Attila Fejzuli Dec 02 '20 at 06:07

1 Answers1

0

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.

hwsw
  • 2,596
  • 1
  • 15
  • 19
  • That's the one I am trying right now but I keep on getting failed builds because of `Error: Sass compilation encountered 2 error(s)`. Have you encountered this already? – computerandcoffee Dec 03 '20 at 03:03
  • Nope, which build chain do you use? Sencha cmd or node based (newer) solution? In case you use Sencha cmd, try to set skip.sass = 1 inside the ./sencha/sencha.cfg file. (btw, i am using Sencha Cmd 6.x) – hwsw Dec 04 '20 at 20:05
  • 1
    I am using sencha cmd, it worked when I add the skip.sass = 1 inside the properties property of package.json. I don't see any sencha.cfg file inside the .sencha folder tho I think because I am using 7.3. I am planning to use the node-based solution later on. – computerandcoffee Dec 07 '20 at 01:10
  • Nice to hear its working. Newer packages dont use sencha.cfg anymore. I have not upgraded my ones. Just fyi, node based build chain still uses Sencha cmd under the hood. Thats why i moved over to an alternative build tool (like described in the answer), i did not like that the node solutions wraps sencha cmd and sencha cmd is basically a wrapper around ant. In order to generate a js artefact, its too much java involved for my personal taste - sencha does not use the node ecosystem properly. – hwsw Dec 07 '20 at 17:02
  • Now that this works. I'll accept your answer. I have learned a lot from you. Well for me, it's not gonna be a big problem because, with the new sencha open tooling, you just need to add the npx directive then the sencha cmd command. Thanks! – computerandcoffee Dec 08 '20 at 08:34