在AngularJS partials中使用Usemin

Aus*_*rts 6 angularjs gruntjs yeoman grunt-usemin

我使用Yeoman来构建一个AngularJS项目.我正在使用'rev'任务来帮助确保我的图像,脚本,样式等被唯一标识.

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

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

  • 的index.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文档说:

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

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

mli*_*bby 0

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

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

usemin: {
  html: 'templates/header.html',
    options: {
    assetsDirs: ['images']
  }  
}
Run Code Online (Sandbox Code Playgroud)