Build should exclude `single-spa` from vendor bundle

[jaydgruber]

With a new app built with single-spa Ember, I get the warning: https://single-spa.js.org/error/?code=41 ("single-spa is loaded on the page multiple times") whenever the Ember app mounts. Other single-spa applications are using Webpack, so have externals: ['single-spa'] in their webpack config.

I've tried a few things to accomplish the same in Broccoli, but with no success yet.

• a broccoli-funnel to exclude single-spa from vendor

  const EmberApp = require('ember-cli/lib/broccoli/ember-app');
  const Funnel = require('broccoli-funnel');
  
  module.exports = function (defaults) {
  let app = new EmberApp(defaults, {
    /* ...other stuff */
    trees: {
      vendor: funnel('vendor', {
        exclude: ['./node_modules/single-spa/**/*'],
      }),
    },
  });
  /* ...other stuff */
  return app.toTree();
  };

• ember-auto-import pass-through the externals option to webpack

  module.exports = function (defaults) {
  let app = new EmberApp(defaults, {
    /* ...other stuff */
    autoImport: {
      webpack: {
        externals: ['single-spa'],
      },
    },
    /* ...other stuff */
  
  });
  return app.toTree();
  };

• some combinations of these two things and ember-auto-import's exclude option

Practical impact: with multiple instances of single-spa on the page, I have been unable to get navigateToUrl working correctly, so every transition between applications is causing a full page reload.

[jaydgruber]

I think perhaps the problem is that ember-auto-import is not handling pass-through of config for webpack externals correctly. https://github.com/ef4/ember-auto-import/issues/412#issuecomment-853364183

[jaydgruber]

note: the project running into this issue is using "ember-auto-import": "^1.10.1"

It is possible that the ember-auto-import 2.x major bump, which is also a webpack 4 -> 5 upgrade might be needed.

[joeldenning]

I don't know much about the ember build process, but yes single-spa should be marked as a webpack external. Webpack externals work in both webpack 4 and webpack 5, but I don't know about ember-auto-import.