reactjs 将React应用程序导出为静态HTML

gmxoilav 于 2022-12-12 发布在 React

关注(0)|答案(2)|浏览(419)

我创建了一个新的React应用程序。新建项目-〉Asp.NET核心-〉React。
当应用程序运行时，屏幕上会显示一个动态内容元素。我想做的是获取此页面的某种HTML转储，这样我就可以将其粘贴到静态Web应用程序中，并呈现相同的屏幕。
我四处看了看，发现了一些工具，比如react-snapshot，它似乎可以完成我想要的任务;但是，似乎是你进还是你出，也就是说，你可以动态呈现或者静态呈现它。2我只想静态转储HTML，并希望保持呈现不变。
例如，在我的Javascript中，我有以下代码：

const htmlSection = document.getElementById("MyHtml");
// Export Html Here

这种事情可能吗？如果可能，如何在代码中实现？

reactjs

来源：https://stackoverflow.com/questions/55188307/exporting-a-react-application-as-static-html

2条答案

按热度按时间

qnakjoqk1#

我确实喜欢这个

const handleExport = () => {

        const link = document.createElement("a");

        // Create a blog object with the file content which you want to add to the file
        const file = new Blob([document.getElementsByTagName('html')[0].innerHTML], { type: 'text/plain' });

        // Add file content in the object URL
        link.href = URL.createObjectURL(file);

        // Add file name
        link.download = "sample.html";

        // Add click event to <a> tag to save file.
        link.click();
        URL.revokeObjectURL(link.href);
    }

HTML和模块样式可以导出，但问题是javascript事件不能再保留了。

赞(0）回复(0）举报 2022-12-12

ddhy6vgd2#

可以使用fs模块读取索引文件，如下所示：fs.readFileSync(path[, options])

赞(0）回复(0）举报 2022-12-12