Как GruntJS может просматривать все файлы, но обрабатывать только те, которые меняются?

Question

У меня есть веб-приложение, структура каталогов которого выглядит следующим образом:

src/
 - styles/
   - a.css
   - b.css
   - c.scss
   - d.scss
 - media/
   - d.jpg
   - e.png
   - f.mpf
dest/
 - css/
 - media/
package.json
Gruntfile.js

Я хочу использовать Gruntfile для просмотра файлов на предмет изменений. И когда они меняются, обрабатывают или копируют их. Я не хочу, чтобы файлы копировались или обрабатывались без необходимости. Я пытаюсь понять, как это сделать с Gruntfile, и нахожу это довольно хитрым.

Я родом из мира C++ и makefiles. Они были хороши тем, что для каждого производного файла вы должны указать команду для его получения и файлы, от которых этот вывод напрямую зависит. Если какой-либо из файлов зависимостей будет новее, чем цель, ваша команда будет выполнена. Если какой-либо из файлов зависимостей отсутствовал, он был бы сгенерирован на основе той же рекурсивной логики.

Как я могу добиться того же здесь, в Гранте? Указание часов позволяет просматривать несколько файлов на предмет изменений. Но тогда команда, которую вы запускаете, обычно не относится к измененному файлу.

Мой Gruntfile здесь. Пожалуйста, покажи мне, как я могу изменить его, чтобы реализовать следующие 3 правила:

• Когда любой файл src / styles /.scss изменяется, скомпилируйте его с помощью Sass и поместите результат в dest / css /.css. Затем уменьшите его до dest / css /*. Min.css
• Когда любой файл src / styles /.css изменяется, скопируйте его в dest / css /.css. Затем уменьшите его до dest / css /*. Min.css
• При изменении любого файла src / media /* скопируйте его в dest / media /*

Я хочу, чтобы эти правила были общими. IE: я не хочу писать отдельные правила для b.scss а также d.scss, Кажется, глупо явно указывать похожие правила для каждого отдельного файла.

Answer 1

Вам нужно добавить модуль grunt-concurrent запустить несколько экземпляров часов:

concurrent: {
 dev: {
   tasks: [
    'watch:sass:12340',
    'watch:copy_css:12350',
   ],
   options: {
    logConcurrentOutput: true
   }
  }
}
grunt.loadNpmTasks('grunt-concurrent');

и я думаю, что я буду редактировать раздел часов следующим образом:

watch: {
  sass: {
      files: ['src/css/*.scss'],
      tasks: ['sass:all','cssmin'],
      options: {
          spawn: false
      }
  },
  copy_css: {
      files: 'src/css/*.css',
      tasks: ['copy:all','cssmin'],
      options: {
          spawn: false
      }
  },
  copy_media: {
    files: 'src/media/**',
    tasks: ['copy']
  }
}

чем бежать grunt concurrent:dev