是否有可能导出阵营单页网站的HTML？

Question

我有使用反应并兑现CSS的单页Web应用程序，我想将其导出为静态的HTML和CSS，以便它可以容易地进行原型设计的目的编辑HTML。是否有可能导出至少一个当前状态的快照？

我试图“拯救页”在Firefox和Chrome，但它并没有提供良好的效果。

Answer 1

可能不理想，但你可以存储整个页面作为一个变量并下载。在浏览器的控制台运行此之后，在页面加载：

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(); 

Answer 2

的ReactDOMServer模块包含渲染作出反应的应用程序为HTML静态页面的功能 - 它是专为服务器上使用，但我不认为有什么阻止你在浏览器中使用它（不要在生产中做到这一点，但！）

import ReactDOMServer from "react-dom/server"; 
import App from "./yourComponent"; 

document.body.innerHTML = ReactDOMServer.renderToStaticMarkup(App);