6

我使用 Yeoman 搭建了一个 AngularJS 项目。我正在使用“rev”任务来帮助确保我的图像、脚本、样式等是唯一标识的。

在我的 AngularJS 应用程序中,我有一个使用 ng-include 指令导入的模板。我的问题是 usemin 正在翻译每个文件中相对于它正在翻译的文件的引用,但是当事物被渲染时,它们被拉入我的 index.html 并且浏览器将事物拉入不同的相对路径。

例如,我有一个目录结构,如下所示:

  • 索引.html
  • 模板/header.html
  • 图片/logo.png

header.html 有时会被拉入 index.html,并引用 images/logo.png。

如果我放入<img src="images/logo.png" />header.html,它会自行正确加载,但不会被 usemin 翻译。

如果我放入<img src="../images/logo.png" />header.html,usemin 会找到并翻译它,但一旦 header.html 被拉入 index.html,它就找不到图像。

usemin 文档说:

当引用是相对的时,默认情况下,引用的项目在相对于目标目录中当前文件位置的路径中查找[强调我的]

“默认”语言让我觉得有一种方法可以告诉它相对路径应该相对于当前文件以外的东西,但我没有找到任何文档告诉我如何改变这种行为。

4

1 回答 1

0

您可以显式声明资产目录(或者只使用绝对路径?)。

https://github.com/yeoman/grunt-usemin#assetsdirs

usemin: {
  html: 'templates/header.html',
    options: {
    assetsDirs: ['images']
  }  
}
于 2015-02-20T22:40:05.730 回答