single-spa consume shared utility module in ember

Question

I want to use single-spa with react and ember apps that will need to share data between them, I would like to use https://single-spa.js.org/docs/module-types/#utilities utility module for exposing observable data.

In react project utility module is consumed via webpacks externals option

reacts webpack:

module.exports = (webpackConfigEnv, argv) => {
  const defaultConfig = singleSpaDefaults({
    orgName: "company",
    projectName: "react-app",
    webpackConfigEnv,
    argv,
  });

  return merge(defaultConfig, {
      externals: {
        "react": "react",
        "react-dom": "react-dom",
        // utility module 
        "@company/utility": "@company/utility"
      }
  });
};

And it works just fine in react, but ember uses ember-cli/broccoli for building an app and I don't know how to consume utility package, is it even possible? Or the only way to use package is to publish it via npm or expose functionality via props when registering ember mf in root-config for example:

registerApplication(
  "ember",
  () => {
    const appName = "ember";
    const appUrl = `${domain}/ember/assets/ember.js`;
    const vendorUrl = `${domain}/ember/assets/vendor.js`;
    console.log({ appName, appUrl, vendorUrl });
    return loadEmberApp(appName, appUrl, vendorUrl);
  },
  (location) => {
    console.log(location.pathname.startsWith("/ember"))
    return location.pathname.startsWith("/ember");
  },
  { // all data from utility module should be exposed here }
);

Answer 1

this'll be possible in the next couple months, with an upcoming embroider release (provided your app is already compatible with today's embroider).

Today, you'll need to build your ember app separately, and point your config at the dist folder that ember-cli outputs.

For more information embroider, the tool for transitioning from broccoli to modern JS tooling, see here: https://github.com/embroider-build/embroider/