Question

我刚刚下载了一份新的自耕农副本。当我使用grunt构建时，我看到我的所有图像都已被转换，并且它们的文件名已被重命名。

但是，html文件中的引用不会引用新名称。

知道为什么吗？

imagemin: {
  dist: {
    files: [{
      expand: true,
      cwd: '<%= yeoman.app %>/img',
      src: '{,*/}*.{png,jpg,jpeg}',
      dest: '<%= yeoman.dist %>/img'
    }]
  }
},

usemin: {
  html: ['<%= yeoman.dist %>/{,*/}*.html'],
  css: ['<%= yeoman.dist %>/styles/{,*/}*.css'],
  options: {
    dirs: ['<%= yeoman.dist %>']
  }
},

ngapp /视图/ main.html中

<a href="#red-green" style="background-image: url('img/demo/red-green.png');background-repeat: no-repeat;"></a>

Answer 1

重命名由Gruntfile中的grunt-filerev任务完成。 usemin任务负责更新脚本，样式表和图像的重命名文件的引用，但不支持内联样式。您应该在样式表中移动background-image引用，或者禁用rev任务。

Answer 2

问题可能是您的HTML文件中的图片网址是相对路径而且usemin无法将图片的新路径解析为您的网址。有关更好的解释，请参阅github上的@eddiemonge评论：https://github.com/yeoman/grunt-usemin/issues/108

我有同样的问题并通过使用固定路径（在您的情况下为/img/demo/red-green.png）修复它，只要您的分发目录使用/ img并且img也关闭，它就可以正常工作进行开发时应用的根目录。

无法使用grunt插件grunt-contrib-imagemin缩小图像

2 个答案: