分发文件源与开发路径源不同答案

【问题标题】：Distribution file source is different to development path source分发文件源与开发路径源不同
【发布时间】：2017-02-03 13:27:49
【问题描述】：

我已经开始使用任务运行器将我的所有文件夹导出到使用 Gulp 的分发文件夹中。当我将图像导出到分发文件夹时出现问题，路径名与我在 src 文件中使用的路径名不同。因此，作为一个例子，当我在 HTML 中定位图像时，我输入：

/assets/images/example.jpg

然而，当 HTML 文件被分发时，它应该定位于：

/images/example.jpg

它仍然指向资产文件夹，并创建了一个死链接。我应该使用像 gulp-replace 这样的模块来自动更改这些路径名吗？或者我应该只输入假定的路径名？或者，我还缺少另一种方法吗？

很抱歉，如果我措辞不好，我正在努力开发一个新的开发环境 - 如果我可以为您提供任何其他详细信息，请告诉我。

【问题讨论】：

您可以简单地将您的 src 子文件夹复制到您的 dist 文件夹中，这样您就有了以下文件夹结构 dist>assets>images>example .jpg。反之亦然，如果 /images/example.jpg 是您希望在分布式代码中使用的路径引用，则从您的 src 中删除 assets 文件夹，这样您就有了以下内容文件夹结构 src>images>example.jpg。无论哪种方式，相对路径引用都不需要在源代码和分发代码之间更改。

【解决方案1】：

我是否应该使用像 gulp-replace 这样的模块来自动更改这些路径名？

是的，gulp-replace 可以解决问题。

作为替代方案，您可以将 index.html 文件放入 assets 文件夹中，这样您在分发项目时无需更改任何路径。

【讨论】：

我认为将文件结构放在一起实际上可能对易读性和结构更有意义 - 感谢您的帮助。
@JCoulam - 你是对的。我认为建议的替代方案应该是您首先尝试实现的目标。如果由于任何原因您无法实现这一点，那么另一种选择是使用另一个依赖项，例如 gulp-replace。