Skip to content

Instantly share code, notes, and snippets.

@alexisg

alexisg/Gruntfile.js

Last active Sep 23, 2015
Embed
What would you like to do?
Webhook.com libsass, autoprefix with css livereload flow.
// This setup will compile sass, run autoprefixer and then launch webhook's default grunt tasks.
// I also uses webhook's build-static task so that it only builds the css and
// allows livereload to refresh the css alone instead of refreshing the entire page.
'use strict';
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
watch: {
sass: {
files: ['sass/**/*.{scss,sass}'],
// Run sass, then autoprefixer, then webhooks build-static to build just the static files and have instantaneous live reload on css changes
tasks: ['sass', 'autoprefixer', 'build-static']
}
},
sass: {
options: {},
dist: {
files: {
'static/css/style.css': 'sass/style.sass'
}
}
},
autoprefixer: {
options: {
browsers: ['last 2 versions', 'ie 9'],
map: true
},
dist: {
src: 'static/css/style.css',
dest: 'static/css/style-prefix.css'
}
}
});
// If you start using advanced map functions you may need to switch to using contrib--sass
// instead of grunt-sass which currently uses an older but way faster libsass
// grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-sass');
grunt.loadNpmTasks('grunt-autoprefixer');
// In a normal setupt you would use the register task like this in grunt
// Since we are using webhooks internal simple watch we are going to expand on that below
// grunt.registerTask('default', ['sass', 'autoprefixer', 'simple-watch']);
// NEVER REMOVE THESE LINES, OR ELSE YOUR PROJECT MAY NOT WORK
require('./options/generatorOptions.js')(grunt);
grunt.loadTasks('tasks');
// Rename webhook's default task to wh-default so we can compile our own css first and then launch wh-default
grunt.renameTask('default', 'wh-default');
grunt.registerTask('default', ['sass', 'autoprefixer', 'wh-default']);
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment