Как настроить Gruntfile.js для просмотра SASS (компас) и JS

Question

Я новичок в использовании gruntjs и nodejs. Я хотел знать, как настроить файл grunt так, чтобы он отслеживал как sass-файлы, так и js-файлы с помощью часов.

Это то, что я до сих пор:

module.exports = function (grunt) { 

    "use strict"; 
    require("matchdep").filterDev("grunt-*").forEach(grunt.loadNpmTasks); 

    grunt.initConfig({ 
    pkg: grunt.file.readJSON('package.json'), 
    compass: { 
     dist: { 
     options: { 
      config: 'config.rb', 
      watch: true 
     } 
     } 
    } 
    }); 

    grunt.registerTask('default', []); 

}; 

Любая помощь будет оценена. Спасибо!

Answer 1

Попробуйте grunt-contrib-watch с grunt-contrib-sass. Они оба Grunt плагинов специально для такого рода вещи:

sass: { 
     dist: { 
      options: { 
       style: 'compressed' 
      }, 
      files: { 
       'css/build/global.css': 'scss/screen.scss' 
      } 
     } 
    }, 


    watch: { 

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

Конфигурация плагина вахтенные будет следить за изменениями в любых .scss файлов, и запустить sass задание (также определено выше). Вы даже можете зацепиться за печень. У вас также может быть несколько часов (выше только определяет часы css); создание второго часового механизма для минимизации JS было бы легко с grunt-contrib-uglify

У меня есть пример, который вы можете посмотреть, что также объединяет JavaScript и выполняет некоторую минимизацию с помощью grunt-contrib-uglify. Here is the example.