Replies: 2 comments 1 reply
-
I haven't really used GitHub discussions, but actually this one about micro-frontends (tbh the first time hearing the term) is pretty similar to what our problem is, we're a vertical dedicated to building a particular chunk of the site via a Svelte/SK app within a large ecosystem sharing the site with other teams. |
Beta Was this translation helpful? Give feedback.
1 reply
-
@iltimasd Hi, I'm also interested in this topic. I tried to embed a kit app within another kit app. It works with physical appearance but doesn't work with living the scripts together. I made a sample application repository as below. |
Beta Was this translation helpful? Give feedback.
0 replies
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
-
My primary question is what is the best approach to embedding SvelteKit into another page. I'm part of a team working to implement Svelte into our website, however we can only really do it in pieces and convert our site page-by-page.
We have a Svelte app embedded in another framework. In the template of the page holding the Svelte app, we have a div that we target using the client-side component api as well as a script tag that, on local points, to localhost:8000/build/build.js
We're looking to migrate to SvelteKit as this particular app has grown, however we're facing problems understanding a path forward to have SvelteKit live inside another page.
Currently I've prototyped 2 solutions
Approach 1: Modify Bootstrap HTML to emulate targeting a div to hydrate with SK
Currently not working, but:
On the page, working off the original Svelte implementation, we have a script tag and target div.
On the SK side, we're using adapter-static and use hooks to convert the HTML with bootstrapping script to just be the JS content, so it can be used as the
src
for our script tag.Approach 2: use an iframe
This seems to work great, however i think SK being in an iframe breaks client-side routing and is doing browser controlled navigation.
Not much to say about the code still using adater-static and using just an iframe:
I'm still working on seeing what the problem with CSR, but i also imagine I would need a layer between the top most window and the iframe to sync URL and Location History.
EDIT: still confirming whether or not iframe CSR is actually broken
In any case, if anyone has ideas on how to embed SK into a larger framework/page with CSR/SPA behavior would love some input or leads
Beta Was this translation helpful? Give feedback.
All reactions