0

I was wondering how to save an HTML file and all dependencies into one file. Unlike an MHTML file, it won't cut it to change style.css to example.com/style.css. It needs to become:<style>[css]</style>

Would you do this by getting, for example, the CSS then creating the <style> tags in the <head> and pasting the style tags? What (if any) JS libraries would I use? Or should I use JQuery and AJAX?

EDIT:

I'm making a tool that can archive pages with CSS and JS inline. For Example, so you can archive data on a site before heading into a meeting, so you don't have to worry about a server being down, or the stats changing.

AceiusIO
  • 11
  • 1
  • 3
  • 1
    Can you provide context for why it is you are doing this? It would be helpful; if the question includes your specific requirements, then the answers will be tailored to meet those requirements. – Alexander Nied Jun 15 '20 at 05:01
  • This sounds more like a task to do at the server. – Teemu Jun 15 '20 at 05:01
  • @Teemu well if you have aceius.com and aceiuscorp.com, their different sites. Or if you use a 3rd party service that you don't have complete control over, this can't be done on the server. – AceiusIO Jun 15 '20 at 05:13

1 Answers1

0

I had a similar project and my solution involved a few parts:

  • Have the intended css in an external file
  • Have a template of your HTML saved as string literal
  • Have the data which you are using stored in a named div when it's rendered
const styleData = await fetch('<some_location>/styles.css')
     .then( res => res.text()); // need to convert the file to useable text

const dataHTML = document.getElementById('dataDiv').innerHTML;


const outputHTML = '<html>
    <head>
<style>
    ${styleData }
</style>
</head>
<body>
    ${dataHTML}
</body>';

From there you can have your main webpage save the data to a file via button as explained here.

Jon Spencer
  • 1
  • For reasons unknown, it breaks my other code. But I'm working on some code based off yours to work with mine. Thanks though! – AceiusIO Jun 15 '20 at 17:09