Note: This question is only relevant for Grunt 0.3.x and has been left for reference. For help with the latest Grunt 1.x release please see my comment below this question.
I'm currently trying to use Grunt.js to setup an automatic build process for first concatenating and then minifying CSS and JavaScript files.
I have been able to successfully concatenate and minify my JavaScript files, although each time I run grunt it seems to just append to the file instead of overwriting them.
As for the minifying or even concatenating CSS, I have been unable to do this as of yet!
In terms of grunt CSS modules I have tried using consolidate-css
, grunt-css
& cssmin
but to no avail. Could not get my head around how to use them!
My directory structure is as follows (being a typical node.js application):
- app.js
- grunt.js
- /public/index.html
- /public/css/[various css files]
- /public/js/[various javascript files]
Here is what my grunt.js file currently looks like in the root folder of my application:
module.exports = function(grunt) {
// Project configuration.
grunt.initConfig({
pkg: '<json:package.json>',
concat: {
dist: {
src: 'public/js/*.js',
dest: 'public/js/concat.js'
}
},
min: {
dist: {
src: 'public/js/concat.js',
dest: 'public/js/concat.min.js'
}
},
jshint: {
options: {
curly: true,
eqeqeq: true,
immed: true,
latedef: true,
newcap: true,
noarg: true,
sub: true,
undef: true,
boss: true,
eqnull: true,
node: true
},
globals: {
exports: true,
module: false
}
},
uglify: {}
});
// Default task.
grunt.registerTask('default', 'concat min');
};
So just to summarise I need help with two questions:
- How to concatenate and minify all my css files under the folder
/public/css/
into one file, saymain.min.css
- Why does grunt.js keep on appending to the concatenated and minified javascript files
concat.js
andconcat.min.js
under/public/js/
instead of overwriting them each time the commandgrunt
is run?
Updated 5th of July 2016 - Upgrading from Grunt 0.3.x to Grunt 0.4.x or 1.x
Grunt.js
has moved to a new structure in Grunt 0.4.x
(the file is now called Gruntfile.js
). Please see my open source project Grunt.js Skeleton for help with setting up a build process for Grunt 1.x
.
Moving from Grunt 0.4.x
to Grunt 1.x
should not introduce many major changes.