I'm currently struggling with the exact same problem described here. We are building an application where components should grow over time and be injected into the client application through a "plugin upload" system.
With the "Vite Library" mode i'm not quite sure if this can be done on runtime.
We would like to place all third party components besides the client. The names of the components can be altered through our backend and a map for reading all the existing components could be placed also or an addiotional endpoint could be created from where all the third party to be loaded components could be fetched from.
// before build
public
┣ plugin-name
┃ ┗ SomeComponent.js
┗ vite.svg
src
┣ assets
┃ ┗ vue.svg
┣ components
┃ ┣ Button.vue
┃ ┣ Header.vue
┃ ┣ Input.vue
┃ ┗ ...
┣ router
┃ ┗ ...
┣ stores
┃ ┗ ...
┣ tailwind
┃ ┗ ...
┣ views
┃ ┗ ...
┣ App.vue
┗ main.js
// after build
dist
┣ assets
┃ ┣ index.805046e9.css
┃ ┗ index.d30e5753.js
┣ plugin-name
┃ ┗ SomeComponent.js
┣ index.html
┗ vite.svg
Example: A bit like wordpress/CMS we are going to release a simple web-application with instruction to developers how to add new components (we ship with simple ones). If they're done with creating a component and building it, they can upload it through the client and the backend places the new components somewhere near the client "dist/externalComponentName/comp.js" or similar. After that, the client should display a new component in a "components/widgets" section from where you can drag&drop items onto your page.
If someone could give me a solution, a GitHub repo, or work out a working example with me, I would be extremely grateful.
