gulp-cssbeautify is not working - css

Question

I'm trying to use gulp-cssbeautify in my projects but I can't make it work .
I have the following dependencies which are working fine except gulp-cssbeautify
" gulp": "^3.9.1",
"gulp-browserify": "^0.5.1",
"gulp-concat": "^2.6.1",
"gulp-connect": "^5.0.0",
"gulp-cssbeautify": "^0.1.3",
"gulp-sass": "^3.0.0",
"gulp-sourcemaps": "^2.4.0",
"gulp-util": "^3.0.8"
This is my gulpfile.js code :
var gulp = require('gulp'),
gutil = require('gulp-util'),
browserify = require('gulp-browserify'),
connect = require('gulp-connect'),
concat = require('gulp-concat'),
sourceMap = require('gulp-sourcemaps'),
sass = require('gulp-sass'),
cssbeautify = require('gulp-cssbeautify');
var env, jsSources, sassSources, htmlSources, sassStyle, outputDir , cssSource;
var env = process.env.NODE_ENV || 'dev';
outputDir = 'dev/';
sassStyle = 'expanded';
jsSources = ['components/scripts/*.js'];
sassSources = ['components/sass/screen.scss'];
htmlSources = [outputDir + '*.html'];
cssSource = ['./' + outputDir + 'css/*.css'];
//gulp.task('js', function() {
// gulp.src(jsSources)
// .pipe(concat('script.js'))
// .pipe(browserify())
// .pipe(gulp.dest(outputDir + 'scripts'))
// .pipe(connect.reload())
//});
gulp.task('sass', function() {
gulp.src(sassSources)
.pipe(sourceMap.init())
.pipe(sass({
compass: true,
css: outputDir + 'css',
sass: 'components/sass',
image: outputDir + 'images',
style: sassStyle
//comments: true,
//require: ['susy', 'modular-scale']
})
.on('error', gutil.log))
.pipe(sourceMap.write('./maps'))
.pipe(gulp.dest(outputDir + 'css'))
.pipe(connect.reload());
});
gulp.task('css', function() {
return gulp.src('.dev/css/*.css')
.pipe(cssbeautify({
indent: ' ',
openbrace: 'end-of-line',
autosemicolon: true
}))
.pipe(gulp.dest('./dev/css/'));
});
gulp.task('watch', function() {
// gulp.watch(jsSources, ['js']);
gulp.watch('components/sass/**/*.scss', ['sass']);
gulp.watch(htmlSources, ['html']);
gulp.watch('.dev/css/*.css', ['css']);
});
gulp.task('connect', function() {
connect.server({
root: outputDir,
livereload: true
});
});
gulp.task('html', function() {
gulp.src(htmlSources)
.pipe(connect.reload())
});
gulp.task('default', ['html', 'sass', 'css', 'connect', 'watch']);
My folder structure for css files is project/dev/css/*.css

Answer 1

Your css task specifies gulp.src('.dev/css/*.css'). Looks like you mean ./dev not .dev.
I recommend reading through your gulpfile and straightenin up your directory names. Sometime you use variables, sometimes you don't. In this example, without changing anything else you could just source gulp.src(cssSource) in your css task