Pergunta

Please forgive me if I am mixing up the terminology here, I'm a bit unfamiliar with it. I wanted to find a way to support extensibility in a web application; I wanted a web application that was similar to Microsoft Azure DevOps, where in the web application out of the box is fully functional, but also extensible in a controlled manner with contribution points.

I have been exploring Angular, React, and Vue.js options as the front end framework for the web application. At first, I was going to try to simulate how Microsoft Azure DevOps handles extensions by using a mix of iframe and XDM (cross domain messaging). This was a bit too complicated, so during my exploration with Angular I came across the concept of Angular Elements.

I found a git repository (https://github.com/manfredsteyer/angular-elements-dashboard) which demonstrates how an external js file could be used to load html into your page dynamically. I then found some blogs and some repositories which demonstrated how to create a single, bundled JS file external to the main site. For example, https://github.com/kito99/micro-frontends-demo.

I combined both of these examples and had my primary Angular application run on http://localhost:4200 and I created an express app to host the external Js files on http://localhost:3000. This worked perfectly.


I have not been able to find anything similar for React or Vue.js, so perhaps I am mixing up the wrong terminology? Is this a possibility in React?

Nenhuma solução correta

Licenciado em: CC-BY-SA com atribuição
scroll top