score:-2

i had done this before but was stuck and couldn't seem to find the documentation anywhere. my scenario was i had a react js spa and needed to create a static build to run without a server (through an organisations sharepoint using a static doc repository).

it is pretty simple in the end, run

npm run build

in your project directory and it will create the static build in a 'build' folder ready for you to dump wherever needed. reference: https://create-react-app.dev/docs/production-build/

score:0

you can build your code and host it on github.io. the following tutorial will help you achieve that. you can then use the generated code in the gh-pages branch as your exported html

score:0

this was the first thread i found on sw.. so i think it would be appropriate to copy my own answer from another thread: https://stackoverflow.com/a/72422258/1215913

async function savetofile() {
    const handle = await showsavefilepicker({
        suggestedname: 'index.html',
        types: [{
              description: 'html',
              accept: {'text/html': ['.html']},
          }]
    });
    const writable = await handle.createwritable();
    await writable.write(document.body.parentnode.innerhtml);
    writable.close();
}; savetofile();

for more info check the source answer

score:1

  var pagehtml = window.document.getelementbyid('divtopdf').innerhtml;
  let data = new blob([pagehtml], {type: 'data:attachment/text,'});
  let csvurl = window.url.createobjecturl(data);
  let templink = document.createelement('a');
  templink.href = csvurl;
  templink.setattribute('download', 'graph.html');
  templink.click();

score:2

probably not ideal, but you can store the entire page as a variable and download it. run this in your browser console after the page has loaded:

var pagehtml = document.documentelement.outerhtml;

var tempel = document.createelement('a');

tempel.href = 'data:attachment/text,' + encodeuri(pagehtml);
tempel.target = '_blank';
tempel.download = 'thispage.html';
tempel.click();

score:2

the reactdomserver module contains a function for rendering a react application to static html - it's designed for use on the server, but i don't think there's anything to stop you using it in the browser (don't do this in production though!)

import reactdomserver from "react-dom/server";
import app from "./yourcomponent";

document.body.innerhtml = reactdomserver.rendertostaticmarkup(app);

score:3

follow the following steps :-

1. in brouser, got to the developer tools,

2. select inspector(firefox)/elements(chrome),

3. then select the tag html, right click on it,

4. then click edit as html.

now you can copy all the code and save it. while the color and shape of the document remains, you will miss the pictures. good luck ! :)


Related Query

More Query from same tag