Add LiveReload Grunt Dev Task

Adds the ability to run a new task via `grunt dev` that will watch our
sass, templates and javascript files for changes and reload them in the browser.

Also, refactored the Gruntfile to auto load all grunt-* tasks to remove
some code.
This commit is contained in:
Jacob Gable 2013-08-17 13:39:02 -05:00
parent 7cd2976dfa
commit 7a5cccf4c2
2 changed files with 75 additions and 23 deletions

View File

@ -8,6 +8,9 @@ var path = require('path'),
distDirectory = path.resolve(process.cwd(), '.dist'),
configureGrunt = function (grunt) {
// load all grunt tasks
require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);
var cfg = {
// Common paths to be used by tasks
paths: {
@ -24,6 +27,67 @@ var path = require('path'),
buildType: 'Build',
pkg: grunt.file.readJSON('package.json'),
// Watch files and livereload in the browser during development
watch: {
handlebars: {
files: ['core/client/tpl/**/*.hbs'],
tasks: ['handlebars']
},
sass: {
files: ['<%= paths.adminAssets %>/sass/**/*'],
tasks: ['sass:admin']
},
livereload: {
files: [
// Theme CSS
'content/themes/casper/css/*.css',
// Theme JS
'content/themes/casper/js/*.js',
// Admin CSS
'<%= paths.adminAssets %>/css/*.css',
// Admin JS
'core/client/*.js',
'core/client/helpers/*.js',
'core/client/models/*.js',
'core/client/tpl/*.js',
'core/client/views/*.js'
],
options: {
livereload: true
}
},
express: {
// Restart any time client or server js files change
files: ['core/server/**/*.js'],
tasks: ['express:dev'],
options: {
//Without this option specified express won't be reloaded
nospawn: true
}
}
},
// Start our server in development
express: {
options: {
script: "index.js"
},
dev: {
options: {
//output: "Express server listening on address:.*$"
}
}
},
// Open the site in a browser
open: {
server: {
// TODO: Load this port from config?
path: 'http://127.0.0.1:2368'
}
},
// JSLint all the things!
jslint: {
server: {
@ -175,17 +239,6 @@ var path = require('path'),
}
},
watch: {
handlebars: {
files: 'core/client/tpl/**/*.hbs',
tasks: ['handlebars']
},
sass: {
files: '<%= paths.adminAssets %>/sass/**/*',
tasks: ['sass:admin']
}
},
copy: {
nightly: {
files: [{
@ -277,18 +330,6 @@ var path = require('path'),
grunt.initConfig(cfg);
grunt.loadNpmTasks("grunt-jslint");
grunt.loadNpmTasks("grunt-mocha-cli");
grunt.loadNpmTasks("grunt-shell");
grunt.loadNpmTasks("grunt-bump");
grunt.loadNpmTasks("grunt-contrib-compress");
grunt.loadNpmTasks("grunt-contrib-copy");
grunt.loadNpmTasks("grunt-contrib-watch");
grunt.loadNpmTasks("grunt-contrib-sass");
grunt.loadNpmTasks("grunt-contrib-handlebars");
grunt.loadNpmTasks('grunt-groc');
// Update the package information after changes
grunt.registerTask('updateCurrentPackageInfo', function () {
cfg.pkg = grunt.file.readJSON('package.json');
@ -601,6 +642,14 @@ var path = require('path'),
"compress:build"
]);
// Dev Mode; watch files and restart server on changes
grunt.registerTask("dev", [
"default",
"express:dev",
"open",
"watch"
]);
// When you just say "grunt"
grunt.registerTask("default", ['sass:admin', 'handlebars']);
};

View File

@ -41,6 +41,9 @@
"grunt-contrib-compress": "~0.5.2",
"grunt-groc": "~0.3.0",
"grunt-mocha-cli": "~1.0.6",
"grunt-express-server": "~0.4.2",
"grunt-open": "~0.2.2",
"matchdep": "~0.1.2",
"sinon": "~1.7.3",
"should": "~1.2.2",
"mocha": "~1.12.0"