title: Getting started with Grunt and sass (partials)
body: <p>I am just getting started with Grunt and am a bit confused about how to configure my gruntfile.js to recognize changes to sass partial files. I've followed the article on <a href="http://24ways.org/2013/grunt-is-not-weird-and-hard/" rel="nofollow">24ways.org</a> by Chris Coyier and feel pretty comfortable with the basics. When running grunt watch, I can make changes to my style.scss file and grunt will watch and compile changes. However, I typically use style.scss as a long list of @imports:</p>
  
  <p><code>@import 'partials/partialfilename';</code> </p>
  
  <p>When I make a change to any of my partials grunt does not notice anything has changed and thus nothing is compiled. </p>
  
  <p>Within my project directory I have a sass directory that includes a style.scss file and a partials directory with lots of partials. </p>
  
  <p>here is my grunt file:</p>
  
  <pre class="lang-js prettyprint-override"><code>module.exports = function(grunt) {
  
  // 1. All configuration goes here 
  grunt.initConfig({
      pkg: grunt.file.readJSON('package.json'),
  
      concat: {   
          dist: {
              src: [
                  'js/custom.js', 
                  'js/foundation.js',
                  'js/jquery.listnav.js',
                  'js/jquery.ioslider.min.js'
              ],
              dest: 'js/build-scripts.js',
          }
      },
  
      uglify: {
          build: {
              src: 'js/build-scripts.js',
              dest: 'js/build-scripts-min.js'
          }
      },
  
      imagemin: {
          dynamic: {
              files: [{
                  expand: true,
                  cwd: 'images/',
                  src: ['**/*.{png,jpg,gif}'],
                  dest: 'images/'
              }]
          }
      },
  
      sass: {
          dist: {
              options: {
                  style: 'compressed'
              },
              files: {
                  'style.css': 'sass/style.scss'
              }
          } 
      }, 
  
      watch: {
          options: {
              livereload: true,
          },
          scripts: {
              files: ['js/*.js'],
              tasks: ['concat', 'uglify'],
              options: {
                  spawn: false,
              }
          },
          css: {
              files: ['sass/**/*.scss'],
              tasks: ['sass'],
              options: {
                  spawn: false,
              }
          },
  
          images: {
              files: ['images/**/*.{png,jpg,gif}', 'images/*.{png,jpg,gif}'],
              tasks: ['imagemin'],
              options: {
                spawn: false,
              }
          }
  
      }
  
  
  
  });
  
  // 3. Where we tell Grunt we plan to use this plug-in.
  grunt.loadNpmTasks('grunt-contrib-concat');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-imagemin');
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-contrib-sass');
  
  // 4. Where we tell Grunt what to do when we type "grunt" into the terminal.
  grunt.registerTask('default', ['watch', 'concat', 'uglify', 'imagemin', 'sass']);
  </code></pre>
  
  <p>};</p>
  
  <p>I have tried a few different options for the watch css arguments such as: </p>
  
  <pre><code>css: {
    files: ['sass/**/*.scss'],
    tasks: ['sass'],
    options: {
      spawn: false
    }
  }
  </code></pre>
  
  <p>and</p>
  
  <pre><code>css: {
    files: ['sass/*.scss'],
    tasks: ['sass'],
    options: {
      spawn: false
    }
  }
  </code></pre>
  
  <p>I realize that I may be 'missing the point' here, I have read a bit about the grunt sass plugin 'ignoring' (_) underscores or partials because of the sass globbing rule (?) and through my research I have noticed that most people are using compass in their projects which I am not. </p>
  
  <p>So, again my question is: How can I configure grunt to watch and compile changes to my sass partials and compile my css correctly?</p>