Skip to content

Instantly share code, notes, and snippets.

@rtvenge
Last active August 29, 2015 13:56
Show Gist options
  • Save rtvenge/8890000 to your computer and use it in GitHub Desktop.
Save rtvenge/8890000 to your computer and use it in GitHub Desktop.
A Gruntfile.js starting point for Grunt
/* package.json
{
"name": "PROJET_NAME",
"version": "4.0.0",
"devDependencies": {
"grunt": "~0.4.1",
"grunt-contrib-concat": "~0.3.0",
"grunt-contrib-uglify": "~0.2.7",
"grunt-contrib-imagemin": "~0.4.0",
"grunt-contrib-watch": "~0.5.3",
"grunt-contrib-compass": "~0.7.0",
"grunt-contrib-jshint": "~0.7.2",
"grunt-svgmin": "~0.3.0",
"grunt-favicons": "~0.6.0",
"grunt-svg2png": "~0.2.1"
}
}
*/
module.exports = function(grunt) {
// 1. All configuration goes here
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
concat: {
dist: {
src: [
'js/libs/*.js', // All lib scripts
'js/src/*.js' // All non-lib scripts
],
dest: 'js/main.js',
}
},
jshint: {
beforeconcat: ['js/src/*.js'],
afterconcat: ['js/main.js'],
options: {
globals: {
jQuery: true,
console: true
}
}
},
uglify: {
build: {
src: 'js/main.js',
dest: 'js/main.min.js'
}
},
favicons: {
options: {
trueColor: true,
precomposed: true,
appleTouchBackgroundColor: "#ffebbc",
coast: true,
windowsTile: true,
tileBlackWhite: false,
tileColor: "#ffebbc",
//This plugin is spotty with creating the html (inc/favicons.php), so, back up the old version first before you run it.
// html: 'inc/favicons.php',
// HTMLPrefix: '/wp-content/themes/supcamp_40/img/favicons/'
},
icons: {
src: 'img/favicon-src.png',
dest: 'img/favicons'
}
},
imagemin: {
dynamic: {
files: [{
expand: true,
cwd: 'img/',
src: ['*.{png,jpg,gif}'],
dest: 'img/'
}]
}
},
svgmin: {
options: {
plugins: [{
removeViewBox: false
}]
},
dist: {
files: [{ // Dictionary of files
expand: true, // Enable dynamic expansion.
cwd: 'img', // Src matches are relative to this path.
src: ['**/*.svg'], // Actual pattern(s) to match.
dest: 'img/', // Destination path prefix.
ext: '.svg' // Dest filepaths will have this extension.
// ie: optimise img/src/branding/logo.svg and store it in img/branding/logo.min.svg
}]
}
},
svg2png: {
all: {
// specify files in array format with multiple src-dest mapping
files: [
// rasterize all SVG files in "img" and its subdirectories to "img/png"
{ src: ['img/**/*.svg'], dest: 'img/' },
]
}
},
watch: {
options: {
livereload: true
},
scripts: {
files: ['js/*.js', 'js/src/*.js'],
tasks: ['concat', 'uglify'],
options: {
spawn: false,
},
},
css: {
files: ['scss/**/*.scss'],
tasks: ['compass:dev'], // change to 'compass:dev-wp' if using Wordpress
options: {
spawn: false,
}
}
},
compass: {
dev: {
options: {
sassDir: 'scss',
cssDir: 'css',
outputStyle: 'nested',
require: 'singularitygs'
}
},
prod: {
options: {
sassDir: 'scss',
cssDir: 'css',
outputStyle: 'compressed',
require: 'singularitygs'
}
},
dev-wp: {
options: {
sassDir: 'scss',
cssDir: '',
outputStyle: 'nested',
require: 'singularitygs'
}
},
prod-wp: {
options: {
sassDir: 'scss',
cssDir: '',
outputStyle: 'compressed',
require: 'singularitygs'
}
}
}
});
// 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-compass');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-svgmin');
grunt.loadNpmTasks('grunt-favicons');
grunt.loadNpmTasks('grunt-svg2png');
// 4. Where we tell Grunt what to do when we type "grunt" into the terminal.
grunt.registerTask('prod', ['compass:prod', 'concat', 'uglify', 'imagemin', 'svgmin']); //change to 'compass:prod-wp' if running Wordpress
grunt.registerTask('favicon', ['favicons']); //takes a while, so it's in a different task
grunt.registerTask('default', ['concat', 'svg2png', 'watch']);
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment