CODEWITHSUNDEEP
sassgruntjswatch
FixMySync
FixMySync

Reputation: 313

Syntax Error in Gruntfile.js - Sass Watch

I'm using grunt.js for the first time and I'm having trouble setting up a sass watch. I've successfully installed node.js and grunt and I was able to get it concatinating and minifying all my javascript files into one file. Then I moved onto trying to get it to watch and compile my sass files and I can't figure out why I keep getting this error in my command line (clearly there is a syntax error, but I don't know where it is?

here is my command line error: Mandy at MandysMac in ~/Desktop/Dropbox/WEBSITES/Portfolio/wp-content/themes/mandy_made_this_theme on master* $ grunt

 /Users/Mandy/Desktop/Dropbox/WEBSITES/Portfolio/wp-content/themes/mandy_made_this_theme/Gruntfile.js:27
  watch: {
  ^^^^^
 Loading "Gruntfile.js" tasks...ERROR
 >> SyntaxError: Unexpected identifier
 Warning: Task "default" not found. Use --force to continue.

 Aborted due to warnings.

Here is my package.json file:

 {
   "name": "mandy-made-this-theme",
   "version": "0.1.0",
   "devDependencies": {
   "grunt": "~0.4.2",
   "grunt-contrib-jshint": "~0.6.3",
   "grunt-contrib-nodeunit": "~0.2.0",
   "grunt-contrib-uglify": "~0.2.2",
   "grunt-contrib-sass": "^0.7.3",
   "grunt-contrib-watch": "^0.6.1"
   }
}

And most importantly, Here is my grunt file:

module.exports = function(grunt) {

 // Project configuration.
  grunt.initConfig({
  pkg: grunt.file.readJSON('package.json'),
  uglify: {
  options: {
    banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
  },
  build: {
    src: ['working/jquery-2.1.0.min.js, working/jquery-ui-1.10.4.custom.min.js',  'working/jquery.smooth-scroll.min.js', 'working/isotope.pkgd.min.js', 'working/scripts.js'], //input
    dest: 'scripts/build/scripts.min.js' //output
   }
  },

  sass: {                            
    dist: {                           
      options: {                      
        style: 'expanded'
      },
      files: {                     
        'style.css': 'sass/style.scss'       
      }
    }
  }

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

  });

 // Load the plugin that provides the "uglify" task.
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-contrib-watch');

// Default task(s).
grunt.registerTask('default',['uglify', 'sass', 'watch']);

}

Upvotes: 0

Views: 1250

Answers (1)

przno
przno

Reputation: 3514

You are missing a comma after sass object

        'style.css': 'sass/style.scss'       
      }
    }
  }, // added , here

  watch: {
      css: {
        files: '**/*.scss',

Upvotes: 1

Related Questions