We currently have a SPA written in Angular with some system components that we would like to re-use on Epi Server side.
I have some pros and cons and some doubts for each option:
Enable headless mode in Epi and re-use/extend SPA application to consume data from episerver
Bring in the required components into Epi (duplicate) and embed them in pages
Rebuild the components in the episerver instance
I'm personally thinking that option 1. might be the best, because it would allow to take full advantage of the components and effort already invested. However OPE support might be challenging (but probably we can convince user to use preview instead of OPE).
My biggest concern is - can headless mode in EPI work with the actual front-end and preview being hosted from a different website/domain. Disregard license limitations - it's DXC.
Running headless mode in with front-end hosted on another website can be done, and if you check my Blazor example site at https://github.com/jtonvang/musicfestival-blazor there is a section in the documentation about running the front-end as a seperate site. The front end here is Blazor/WebAssembly, but the same principles apply.