1

我在一个非常大的企业 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 引用图像url(/path/to/image.png)，因此如果您解压缩并查看 HTML，这些链接将被破坏
  • 实际上还有数以千计的其他 JS/CSS 文件/图像也位于演示不使用的相同文件夹中，因此仅压缩整个文件夹会导致 zip 文件非常臃肿

反正 -

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

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

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

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

/ui/demoapp/css/theme.css

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

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

我相信这个工作的相对图像路径应该是这样的：

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

4

1 回答 1

1

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

  1. 现代浏览器在“文件”菜单下或在 Chrome 中的一个菜单上有一个“将页面另存为...”选项。但是，当页面由 javascript 生成时，这并不总是正常工作

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

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

于 2013-09-06T22:10:09.433 回答