Grunt build does not create css files
angularjs, compass-sass, css, gruntjs, yeoman
Solution
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.
Problem
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!