Create ember example

[joeldenning]

See https://medium.com/@tomsoderlund/bret-i-must-say-single-spa-is-the-best-solution-for-micro-frontends-ive-seen-so-far-fb1693b485de. We should add an ember example, which may include publishing a single-spa-ember helper library.

[dshrestha]

I am also trying to create an ember-app as a child app with single spa, but I am facing an issue with loading the build source files. I added a stack overflow post with all the steps here : https://stackoverflow.com/questions/45438094/issue-in-loading-ember-app-as-child-application-in-single-spa

your feedback would be most valuable. Thanks.

[joeldenning]

I'll take a look at this later today. I've been working on this issue in the last few days, hopefully I'll be able to help

[joeldenning]

@dshrestha Thanks for the detailed description in the stackoverflow, I have responded to it.

Also I just created a pr (https://github.com/CanopyTax/single-spa-examples/pull/37) that shows an ember app coexisting with all the other apps (react, angular, etc). It is still very much a wip, would you be interested in helping solve some of the remaining issues that I am facing? I am not very experienced in Ember and would appreciate contributions to that pr or just consultation on how best to approach things.

Here are the things I have learned so far:

• Using autoRun: false inside of the ember-cli.build.js file is necessary so that single-spa can control when the application is mounted. See https://ember-cli.com/asset-compilation#integration and https://github.com/CanopyTax/single-spa-examples/pull/37/files#diff-687487ab99aea9d3503cc2b8d13c5345R8
• App.create({}) is the key to implementing the mount lifecycle for single-spa
• application.destroy() is the key to implementing the single-spa unmount lifecycle

Here are the issues I'm still facing:

• Ember-cli assumes that it has control over the html page. It creates a <meta> tag that is used later, and also injects other things right into the html file. But in a single-spa world, there are many apps that all share the same html file. So a lot of the ember cli commands may not work if they need to alter the html file.
• Ember-cli/broccoli produce bundles that use window.define() and require() for module loading. This makes it tricky if you're using a separate module loader like SystemJS. Ideally, the bundle would just export some things via a exports.thingToExport = ... which SystemJS would understand fine, but unfortunately it is calling window.define() which is something that SystemJS can also understand but only under the correct circumstances. Basically we're in a situation where there are two separate module loaders (SystemJS versus ember's define) and two separate module registries, but we really want EmberJS to play nice as just a module in SystemJS' module registry.

[dshrestha]

@joeldenning I really appreciate your quick response. Would definitely love to help resolve this with best of my abilities.

Thanks again.