styleguide grunt kss

gruntfile.js

module.exports = function(grunt) {
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    //clean
    clean: {
      styleguide: ['styleguide'],
      css: ['css']
    },
    //copy
    copy: {
      styleguide: {
        files: [
          { src: ['sass/styleguide.md'], dest: 'css/styleguide.md'}
        ]
      },
      styleguidecss: {
        files: [
          { src: ['css/style.css'], dest: 'styleguide/style.css'}
        ]
      }

    },
    // compass
    compass: {
      dist: {
        options: {
          sassDir: 'sass',
          cssDir: 'css',
          config: 'config.rb'
        }
      }
    },
    //cssmin
    cssmin: {
      //fixes the non production .scss file & minifice it to the max min.css
      minify: {
        expand: true,
        cwd: 'css/',
        src: ['*.css', '!*.min.css'],
        dest: 'css/',
        ext: '.min.css'
      }
    },
    //shell
    shell: {
      //build the styleguide based on the css file we created with compass
      styleguide: {
          command: 'kss-node css styleguide --css css/style.css --template styleguide-template'
      }
    },
    //uglify
    uglify: {
      options: {
        banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n'
      },
      build: {
        src: 'js/<%= pkg.name %>.js',
        dest: 'js/<%= pkg.name %>.min.js'
      }
    },
    //browserSync
    browserSync: {
      dev: {
        bsFiles: {
          src: 'css/*.css'
        },
        options:{
          watchTask : true,
          server: {
            baseDir: "styleguide"
          }
        }
      }
    },
    //watch
    watch: {
      sass: {
        files: 'sass/**/*.scss',
        tasks: ['compass'],
        options: {
          reload: true
        }
      },
      // copy the style.css file ... maybe i should do a symlink
      styleguide: {
        files: 'sass/**/*.scss',
        tasks: ['compass','copy:styleguidecss'],
        options: {
          reload: true
        }
      },
      js:{
        files: ['js/*.js'],
        tasks: ['uglify'],
      }
    },


  });

  //load------------------------------------------
  grunt.loadNpmTasks('grunt-contrib-clean');
  grunt.loadNpmTasks('grunt-contrib-copy');
  grunt.loadNpmTasks('grunt-contrib-cssmin');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-compass');
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-browser-sync');
  grunt.loadNpmTasks('grunt-shell');

  //register----------------------------------------
  // build the styleguide: clean up everything first run compass copy styleguide.md to create index page
  // for the styleguide. Then run the shell & create all tehe files
  grunt.registerTask('styleguide', ['clean', 'compass' ,'copy:styleguide' ,'shell:styleguide']);

  //Build the css & js files compressed - needs to minimiz images
  grunt.registerTask('build', ['clean', 'copy', 'compass', 'cssmin', 'uglify','shell:styleguide']);

  //Styleguide building with browser sync on css file 'browserSync',
  grunt.registerTask('go', ['browserSync','watch:styleguide'] );

  //Just for the sass building - no compression no nothing
  grunt.registerTask('sass','watch:sass');
  //Just the js
  grunt.registerTask('js', 'watch:js');


}