Does single-spa-angular support retrieving apps from a different domain?

[liuyiba]

I cloned the coexisting-angular-microfrontends. It works perfectly.
But now I have question about how to register an application from different domain.
Something like
singleSpa.registerApplication('app2', () => download('http://abc/main.abcd.js', 'MyAngulurApp'), location => location.pathname.startsWith('/app2'));

[joeldenning]

I'm glad coexisting-angular-microfrontends worked for you 👍

Different domains

Yes. Loading apps from a different domain is possible by changing the index.html file to point to that domain. I don't think you'll run into any CORS issues loading from a different domain since iirc script tags don't have that problem, but if so you'll have to resolve those the same as any other CORS issues.

Lazy loading

See related #44. The plan is to encourage people to use SystemJS@3 to implement lazy loading for applications. So instead of download('http://abc/main.abcd.js') it would be System.import('http://abc/main.abcd.js'). However, the documentation is not there yet for that. I am building a tool called single-spa-playground that will help people get SystemJS set up, and my plan is to encourage people to use that tool in order to get the lazy loading working.

Changing bundle urls dynamically based on environment

This will also be solved with SystemJS and single-spa-playground. The main concept that makes it possible is import maps. You have a different import map for local vs stage vs prod, which allows you to control which url to download the bundles from.

[liuyiba]

Yes, I tried to get it use the script tag. And download the main.js successfully. But then how to register it in singleSPA? Do you have some API to handle it or please give me some demo.

[liuyiba]

I tried to register it in single SPA. The error "Application 'app2' died in status LOADING_SOURCE_CODE: "does not export an unmount function or array of functions" will show. Do I missing someting?

[joeldenning]

There are a lot of things that could be causing the issue -- try checking the following things:

• The libraryName should be app2
• If you <script> tag your main.js file, a window.app2 variable should be defined. Check this in the browser console.
• Your implementation of scriptTagApp isn't shown, but potentially could be faulty

[liuyiba]

Thank you for your reply. Now I tried two solutions.
Solution one:
Use <script> tag my app2 main.js file. it works will.
Solution two:
Use scriptTagApp to get app2 main.js file. it will throw the error :

And here is my scriptTagApp function.

[joeldenning]

Try changing resolve(window[globalVarName]) to resolve(window[globalVarName].default) (similar to how app1 is doing window.app1.default.

[gowthamSelvaraj]

Loading from different domain is working unless its is lazy loaded.

I'm using angular 7 and register application in main app using system js

singleSpa.registerApplication(
        'about-us',
        () => System.import('http://localhost:7700/v1/about-cvs/main.js'),
        location => true
);

now the main app is loading, I have no issues here in about-us angular app i have a lazy loaded module for route link '/lazyload'. So when i navigate its trying to load the lazy loaded module from the host of the main app rather than http://localhost:7700. how to resolve this issue

[joeldenning]

@gowthamSelvaraj the answer to your question is webpack public path. See related set-public-path.js and systemjs/systemjs#1939

[joeldenning]

Closing because original issue seems to be solved.