XDK designer uses it's own Intermediary Language (IL)?

[Adam_G_]

I was wondering if someone could let me know how the designer in the XDK works.  When I look at the code it creates, (for example if you start an Ionic project) I noticed it doesn't add the .js file for ionic.  I also noticed that there doesn't seem to be a lot of ionic specific code.  Since I know it will compile and work correctly, is the XDK using compile-time editing to make this work?  I notice a ton of <div> tags get added to everything (same for my jQuery Mobile apps).  Does the XDK doa  compile time translation? if so, what is the reason (is this so you can use one designer and then compile (or change) to whatever framework the user wants?  Does this mean I can switch frameworks of existing projects?  If not; where are the .js files for the other frameworks (like Ionic) so I can write to them?  Does it automatically include Angular.js as well?

[Chris_P_Intel · Accepted solution]

Hello,

App Designer does not use its own intermediary language (though it does use LESS to generate CSS).  It works from and on the code of your project.  It reads and writes HTML, LESS, and Javascript.  

for example if you start an Ionic project) I noticed it doesn't add the .js file for ionic

The .js files for Ionic won't be added until you insert an Ionic control.  Likewise, it will only insert Angular if you insert an Ionic control that requires Angular. 

 I notice a ton of <div> tags get added to everything

You'll get "extra" divs as you need them. If you start a project and insert a button, you'll get a button. Nothing else.   But you insert an input field, it is accompanied by a label that can be placed before, after or above it, then you'll get a parent div with the label and the input.  If you add a page, you'll surround everything in a page and sub-page div.  If you add an animated sidebar (or certain other "whole page" affecting widgets") then there may be an additional <div> put around your content or sub-pages.  But, if you were doing this by hand you'd mostly end up with the same organization.  Maybe you could save a div if you always wanted all your labels before, never after, and maybe you could save a div if you know you absolutely aren't going to have sub-pages. 

Does the XDK doa  compile time translation?

No.

Does this mean I can switch frameworks of existing projects? 

Well, the "this" in your sentence is non-existing. But, yes, you can switch frameworks. There is a menu on the Design toolbar that will let you switch to a different framework. However, the conversion is not fool-proof. Some frameworks have controls that the others do not ,and this will lead to imperfect conversions.  Your original file is backedup.

You can also make multiple .html files in a single project and give each of them a different framework. I do this all the time.  This won't work for a final shippable project, because some of the frameworks hijiack links. So they attempt to load a page _in_. You will not know pain until you try to load an Ionic document _into_ a JQM host page.    But it can be fun for experimentation

Hope this helps,

Chris

[Adam_G_]

Awesome info; thanks for the details!