Команда Grunt 'watch' не работает

Question

Когда я запускаю задание grunt watch в своем терминале, он, похоже, не набирает никаких изменений при изменении файлов.

Я не уверен, что это моя файловая структура или конфигурация в моем Gruntfile.js. Может ли кто-нибудь сообщить мне, что я сделал неправильно?

sass: { 
     dist: { 
      options: { 
       style: 'compressed', 
       require: 'susy' 
      }, 
      files: { 
       'app/styles/css/main.css': 'app/styles/sass/main.scss' 
      } 
     } 
    }, 

    css: { 
     files: ['css/*.scss'], 
     tasks: ['sass'], 
     options: { 
      spawn: false, 
     } 

    }, 
    watch: { 

     css: { 
      files: 'app/styles/sass/*.scss', 
      tasks: ['sass'], 
      options: { 
       livereload: true, 
      }, 
     } 

    } 

}); 


grunt.loadNpmTasks('grunt-contrib-sass'); 
grunt.loadNpmTasks('grunt-contrib-watch'); 
grunt.loadNpmTasks('grunt-autoprefixer'); 
grunt.loadNpmTasks('grunt-contrib-cssmin'); 
grunt.loadNpmTasks('grunt-contrib-watch'); 
grunt.loadNpmTasks('grunt-sprite-generator'); 
grunt.registerTask('watchfiles', ['sass', 'watch' ]); 

Answer 1

Предполагая, что вы хотите посмотреть, чтобы слушать изменения в .scss файлов в подкаталоге атомов, в циферблате CSS задача изменении конфигурации files: 'app/styles/sass/*.scss' в files: 'app/styles/sass/**/*.scss'

Прямо сейчас вы только смотреть файлы с расширением .scss, которые также являются непосредственными дочерними элементами вашего каталога sass. Добавление двух звездочек **/*.scss сообщает grunt-contrib-watch, что вы хотите смотреть все файлы с выпиской .scss в реестре sub-ds sass dirs.

Предлагаемое предложение по запросу для создания задачи под названием watchfiles не является хорошим, на мой взгляд. Это предложение состоит в том, чтобы продвигать именование задач, которое является чрезмерно общим и не описывает, что делает задача, и создает дополнительный слой, который просто не нужен.

Чтобы устранить любые другие слои, которые добавляют неопределенности, при тестировании работает ли это или нет, вызовите watch:css задачу непосредственно, выполнив команду grunt watch:css в том же каталоге, что и Gruntfile.js, вносить изменения и наблюдать результаты.