Grunt imagemin - 观看多个文件/文件夹优化单个文件？答案

【问题标题】：Grunt imagemin - watch multiple files/folders optimise single file?Grunt imagemin - 观看多个文件/文件夹优化单个文件？
【发布时间】：2013-12-17 10:29:27
【问题描述】：

是否可以使用 grunt-contrib-imagemine 和 grunt-contrib-watch 监视多个文件/文件夹但只优化单个文件？

我试过这样：（gruntfile 的一部分）

imagemin: {
  dist: {
    cwd: 'images/modules',
    files: ['images/modules/**/*.{png,jpg,gif}'],
    dest: 'images/modules'
  }
},

watch: {
   images: {
      files: ['images/modules/**/*.{png,jpg,gif}'],
      tasks: ['imagemin'],
      options: {
      spawn: false,
      }
    }
}

grunt.event.on('watch', function(action, filepath, target) {
  if (grunt.file.isMatch(grunt.config('watch.images.files'), filepath)) {
      grunt.config('imagemin.dist.src', [filepath]);
   }
});

但它不起作用。它返回：

Running "imagemin:dist" (imagemin) task
Verifying property imagemin.dist exists in config...OK
Files: [no src] -> images/modules
Options: optimizationLevel=7, progressive, pngquant=false
Options: optimizationLevel=7, progressive, pngquant=false
Warning: path must be a string

有什么想法吗？谢谢。

【问题讨论】：

标签： javascript gruntjs grunt-contrib-watch

【解决方案1】：

基于 grunt-contrib-imagemin docs，文件属性采用 src/dest（键/值）对的对象。

files: {                         // Dictionary of files
    'dist/img.png': 'src/img.png', // 'destination': 'source'
    'dist/img.jpg': 'src/img.jpg',
    'dist/img.gif': 'src/img.gif'
  }

我相信这就是您收到错误的原因。

为了做你想做的事，至少我认为你想做的事，我会向 imagemin 添加另一个子任务，如下所示。

imagemin: {
  dist: {
    files: [{
    expand: true,                              // Enable dynamic expansion
    cwd: 'images/modules',                     // Src matches are relative to this path
    src: ['images/modules/**/*.{png,jpg,gif}'],// Actual patterns to match
    dest:'images/modules'                      // Destination path prefix
    }]
  },
  single: {
    cwd: 'images/modules',
    files: 'images/modules/img.png': 'images/modules/img.png', 
    dest: 'images/modules'
  }

},
watch: {
    images: {
      files: ['images/modules/**/*.{png,jpg,gif}'],
      tasks: ['imagemin:single'],
      options: {
      spawn: false,
      }
    }
}

所以上面的 watch 命令将监视所有匹配文件正则表达式的文件，并将执行 watch 主任务的 single 子任务。

我再次认为这是你想要做的，但如果不是，你能解释一下吗？

【讨论】：