如何在页面构建器中导出设计的HTML页面

Question

我已经使用JavaScript创建了一个简单的页面构建器（可以创建列，选项卡，按钮等）。

现在我想让用户导出使用我的页面构建器创建的网页。我想下载＆＃34;下载＆＃34;工具栏中的按钮，当用户单击它时，用户会收到一个zip存档（下载），其中包含用户创建的HTML页面（这是问题）所有其他依赖项，如CSS，JS和字体文件。

我该怎么做？

注意：

• 我可以将所有这些内容放在HTML页面中，但由于我有几个JS和CSS文件，它会变得很大。
• 我只使用JavaScript（和jQuery）来创建此页面构建器，并且我不会为它使用任何服务器端语言（因此下载按钮也应该使用JavaScript和jQuery）。

我有这个代码来下载当前的HTML页面（但不是依赖项）：

window.onload = function() {};
$(document).on('click', 'body', function() {
    var txt = $("#test").html();
    document.getElementById('link').onclick = function(code) {
        this.href = 'data:text/plain;charset=utf-8,' + encodeURIComponent(txt);
    };
});
main();