Wie man Gruntfile.js auf SASS (Kompass) und JS

Question

einrichten Ich bin neu mit Gruntjs und Nodejs. Ich wollte wissen, wie kann ich die gruntfile so einrichten, dass es sowohl die Sass-Dateien und die JS-Dateien überwacht mit Uhr beobachtet. Diese

ist das, was ich bisher:

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', []); 

}; 

Jede Hilfe wird sehr geschätzt. Vielen Dank!

Answer 1

Versuchen Sie grunt-contrib-watch mit grunt-contrib-sass. Sie sind beide Grunt-Plugins speziell für diese Art der Sache:

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


    watch: { 

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

Die Uhr Plugin-Konfiguration oben für Änderungen in allen .scss Dateien sehen wird, und läuft die sass beauftragt (auch oben definiert sind). Sie können auf diese Weise sogar in den Liveload einsteigen. Sie können auch mehrere Uhren haben (das obige definiert nur eine css Uhr); Erstellen einer zweiten Uhr zu Minify JS wäre einfach mit

Ich habe ein Beispiel, das Sie betrachten können, dass auch verkettet JavaScript und tut einige Verkleinerung mit grunt-contrib-uglify. Here is the example.