I am new to Yeoman and Grunt.
While doing Grunt build the build seem to end successfully but dist/styles/*.css files are not being created.
From the logs it looks like the styles are compiled to .tmp/styles/ (see "compass:dist" (compass) task below) but not being copied or minified to dist/styles. and thats why "usemin:css" (usemin) does not file the files. - But this is only a guess.
I am using the basic Gruntfile.info that is generated by yeoman (I added it below) and the only change I made was to comment out the cssmin task since suppose to do the same thing.
Here is the build output:
$ grunt build
Running "clean:dist" (clean) task
Running "bower-install:app" (bower-install) task
Running "useminPrepare:html" (useminPrepare) task
Going through app/index.html to update the config
Looking for build script HTML comment blocks
Configuration is now:
concat:
{ generated:
{ files:
[ { dest: '.tmp\\concat\\scripts\\scripts.js',
src:
[ LIBRARIES ] },
{ dest: '.tmp\\concat\\scripts\\modules.js',
src:
[ SOURCE ] } ] } }
uglify:
{ generated:
{ files:
[ { dest: 'dist\\scripts\\scripts.js',
src: [ '.tmp\\concat\\scripts\\scripts.js' ] },
{ dest: 'dist\\scripts\\modules.js',
src: [ '.tmp\\concat\\scripts\\modules.js' ] } ] } }
cssmin:
{}
Running "concurrent:dist" (concurrent) task
Running "imagemin:dist" (imagemin) task
? app/images/yeoman.png (saved 9.06 kB)
Minified 1 image (saved 9.06 kB)
Done, without errors.
Running "svgmin:dist" (svgmin) task
Done, without errors.
Running "compass:dist" (compass) task
directory .tmp/styles/
create .tmp/styles/bootstrap.css (1.759s)
create .tmp/styles/main.css (0.117s)
create .tmp/styles/problem-comprehension.css (0.002s)
create .tmp/styles/problem-timedword.css (0.002s)
create .tmp/styles/track-detail.css (0.009s)
Compilation took 1.915s
Done, without errors.
Running "autoprefixer:dist" (autoprefixer) task
Prefixed file ".tmp/styles/bootstrap.css" created.
Prefixed file ".tmp/styles/main.css" created.
Prefixed file ".tmp/styles/problem-comprehension.css" created.
Prefixed file ".tmp/styles/problem-timedword.css" created.
Prefixed file ".tmp/styles/track-detail.css" created.
Running "concat:generated" (concat) task
File ".tmp\concat\scripts\scripts.js" created.
File ".tmp\concat\scripts\modules.js" created.
.
.
.
Running "usemin:html" (usemin) task
Processing as HTML - dist/404.html
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input
.
All HTML files in the project
.
Running "usemin:css" (usemin) task
Running "htmlmin:dist" (htmlmin) task
File <FILE>.html created.
Done, without errors.
Execution Time (2014-02-06 22:23:38 UTC)
clean:dist 1.3s ■■■■■■■■■■ 7%
concurrent:dist 5.3s ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ 29%
ngmin:dist 2.3s ■■■■■■■■■■■■■■■■■ 13%
copy:dist 6.1s ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ 33%
uglify:generated 2.6s ■■■■■■■■■■■■■■■■■■■ 14%
usemin:html 349ms ■■■ 2%
Total 18.4s
The build target from Grunt.js:
grunt.registerTask('build', [
'clean:dist',
'bower-install',
'useminPrepare',
'concurrent:dist',
'autoprefixer',
'concat',
'ngmin',
'copy:dist',
'cdnify',
// 'cssmin',
'uglify',
'rev',
'usemin',
'htmlmin'
]);
Cheers!
Yeoman out of the box needs some tweaking in my experience. It's Grunt engine really wants to minify things - that's one of it's major value-adds. I'm pretty new to it as well, but I imagine the empty cssmin area in the grunt file is what's messing you up. Try putting something like this into your cssmin area of gruntfile.js -
cssmin: {
dist: {
files: {
'<%= yeoman.dist %>/styles/main.css': [
'.tmp/styles/{,*/}*.css',
'<%= yeoman.app %>/styles/{,*/}*.css'
]
}
}
},
That should do you give your css minification some teeth. And, then you would uncomment cssmin in build task at the bottom of gruntfile.js so it runs when you do 'grunt build' on the CLI.