How to force the server to render a separate component on the server?

Question

Vue.js

Good day.
There is a page editor written in vue. It has a component that is responsible for rendering the page itself. It takes json as input and renders the page accordingly. I want to make a button, when clicked, this page goes to the server in the form of html + css + js. There is an idea to use ssr, but I don’t want to connect large tools like nuxt for this, and I also would like to render only one component, and not the entire application.
How can this be implemented?

Answer 1

javascript on the client side has full access to the generated html, in its final form, i.e. already formed css properties, if you walk through the DOM code in a cycle, you can collect a complete copy of html, styles can be obtained already formed after applying css both in the form of code and element by element.
Also, using element.outerHTML, you get a ready-made html code that you can safely connect anywhere (you will have to copy the css files yourself, and disable javascript in those places where it interferes)