Integrating Phonegap and AEM 6 (including third party libraries)

[#1]

Hello newbe here,

I am trying to create a brand new Phonegap app and insert in the pages some of the components I have just created. So basically I am working over the project Bruce Lefebvre made in this page: https://github.com/blefebvre/aem-phonegap-starter-kit

I have been able to run this app in my iOS emulator and everything seems to work fine, but when I add my components (which are using some external libraries like jQuery and PathFinding.js ) seems to be like the libraries are not being loaded.

So that is basically my problem, how can I set the libraries in order to get them loaded when the app runs? 

PD: The way I indicate the libraries in my *.jsp files is by adding this line <cq:includeClientLib categories="jquery"/>

PD2: I am able to load the libraries and making everything work fine at the author instance, loading the pages directly from Chrome.

[#2]

AEM Apps builds upon the existing ContentSync framework. See http://docs.adobe.com/docs/en/aem/6-0/develop/mobile/contentsync.html

ContentSync is used to export the content from AEM into a zip which contains the static files representing your app (content and resources)

If you use libraries or more and do not see them once exported from AEM you should review your ContentSyncconfiguration(s).  The shell configuration exports several clientlibs as seen at https://github.com/blefebvre/aem-phonegap-starter-kit/tree/master/content/src/main/content/jcr_root/.... As Anthony mentioned earlier there are options on how to get you libraries in.

Looking at Bruce's repo there are several ContentSync configs (searching for node type of contentsync/config over repo);

aem-phonegap-starter-kit-master\content\src\main\content\jcr_root\content\phonegap\app_name_placeholder\en\_jcr_content\pge-app\app-config\.content.xml(9): sling:resourceType="contentsync/config"
aem-phonegap-starter-kit-master\content\src\main\content\jcr_root\content\phonegap\app_name_placeholder\en\_jcr_content\pge-app\app-config-dev\.content.xml(9): sling:resourceType="contentsync/config"
aem-phonegap-starter-kit-master\content\src\main\content\jcr_root\content\phonegap\app_name_placeholder\shell\_jcr_content\pge-app\app-config\.content.xml(9): sling:resourceType="contentsync/config"
aem-phonegap-starter-kit-master\content\src\main\content\jcr_root\content\phonegap\app_name_placeholder\shell\_jcr_content\pge-app\app-config-dev\.content.xml(9): sling:resourceType="contentsync/config"
aem-phonegap-starter-kit-master\content\src\main\content\jcr_root\content\phonegap\app_name_placeholder\shell\_jcr_content\pge-app\app_name_placeholder\.content.xml(9): sling:resourceType="contentsync/config"
aem-phonegap-starter-kit-master\content\src\main\content\jcr_root\content\phonegap\app_name_placeholder\shell\_jcr_content\pge-app\app_name_placeholder-dev\.content.xml(9): sling:resourceType="contentsync/config"

Note 6 configs.

There are main 2 packages contributing content; en and shell.

Each has a complimentary dev copy of the config. (dev to latest JCR changes, main/production to manage production app updates).

Shell has an additional aggregate package (also has a complimentary dev copy) that represents the full app. This config is the one that pull in all other content packages into a single consolidated export (in this case en + shell).

You may have more package then you choose to include in the initial app. Package not included in the initial app can be delivered to the app as an update as needed as they would not be part of initial app.

John