有没有办法使用相对路径导出带有CSS / images / etc的页面？

Question

我在一个非常大的企业Web应用程序上工作 - 我创建了一个非常简单的原型HTML页面 - 它只是一个CSS列表，JS包含很少的标记。但是，它总共包含57个CSS包含和271个javascript包含（疯狂的权利??）

在制作中，这些CSS / JS文件将以各种方式缩小和组合，但出于开发目的，我不会打扰。

HTML由一个简单的apache HTTP服务器提供服务，我用这样的URL命中它：http://localhost/demo.html我和其他人分享这个链接，但你必须在防火墙后面才能访问它。

我想将这个带有所有引用的JS和CSS文件的HTML文件打包成ZIP文件并与其他人共享，以便所有人都需要解压缩并直接打开HTML文件。

我有两个问题：

• CSS文件使用这个url(/path/to/image.png)之类的URL来引用图像，这些URL不是相对的，所以如果你解压缩并查看HTML，这些链接就会被破坏
• 实际上还有成千上万的其他JS / CSS文件/图像也在这些文件夹中，但是这些文件只是拉动整个文件夹会导致文件非常臃肿

无论如何 -

我会定期创建这些类型的演示，是否有一些简单的方法可以创建一个ZIP：

1. 更新了使用相对网址的CSS文件
2. 仅包含此html引用的JS / CSS，以及仅包含特定CSS文件引用的图像

如果我可以在没有一堆手工作品的情况下做到这一点，如果它可以自动某种方式，那就太棒了！

例如，一个CSS文件可能具有以下路径和文件名。

/ui/demoapp/css/theme.css

在这个CSS文件中，您会找到许多像这样的图像引用：

url(/ui/common/img/background.png)

我相信这样做可以使相对图像路径看起来像这样：

url(../../common/img/background.png)

Answer 1

我将回答我自己的问题，因为我已经为自己的目的解决了这个问题。我发现有两个选项很有用：

1. 现代浏览器在“文件”菜单下有一个“将页面另存为...”选项，或在一个菜单上的Chrome中。但是，当页面由javascript

生成时，这并不总是正常工作

2. 我创建了自己的自定义应用程序，可以解析所有CSS / Javascript资源并将CSS引用转换为相对URL;但是，这对其他人来说并不是一个好的答案。

如果其他人知道一个常用的实用程序或类似的东西比使用“将页面保存为...”选项中内置的浏览器更好 - 请随意发布另一个答案。