Can't process the output of the gulp-compass task. about gulp-compass HOT 14 OPEN

Aha! Thanks for the pointer, I managed to work around this oddity for now using 2 separate tasks as follows.

In task 1, I purely compile the scss to css using compass and setting the compass css_dir to a .tmp folder.
Then in task 2, I gulp.src the .tmp files and work with them, writing the output back into the actual assets/css folder.

Not particular nice or clean, but it does seem to work for now.

// Work with our SCSS files.
gulp.task('compass', function() {
  gulp
    .src('assets/scss/**.scss')
    .pipe( tasks.compass( { config_file: './config.rb' } ) )
    .pipe( gulp.dest('.tmp') );
});

// Add vendor prefixes to our generated CSS file.
gulp.task('autoprefixer', function() {
  gulp
    .src('.tmp/**/*.css')
    .pipe( tasks.autoprefixer( 'last 2 versions', 'ie 8' ) )
    .pipe( gulp.dest('.') )
    .pipe( tasks.livereload(server) )
    .pipe( tasks.filesize() );
});

And then in the livereload server task:

    gulp.watch('assets/scss/**',            function(e) { gulp.run('compass'); });
    gulp.watch('.tmp/**/*.css',             function(e) { gulp.run('autoprefixer'); });

from gulp-compass.

The code for this module is confusing... The file object is never actually being manipulated - it runs compass on the file contents but doesn't use the output at all. Very strange.

from gulp-compass.

If this is writing to a tmp folder and not modifying the files in the stream its violating the plugin guidelines

from gulp-compass.

Hi @jannisg,

Please update to version 1.0.2 and try it again.

Thanks.

from gulp-compass.

@appleboy Is there any way to prevent this from writing to disk? Plugins should not be writing this to disk - they should only be modifying the contents in memory and passing them along. The actual disk write happens in gulp.dest

from gulp-compass.

@contra I try to find another way to prevent this from writing to disk, but the compass command is not support with displaying CSS result directly.

I will try to find another approach. Thanks.

from gulp-compass.

@appleboy I know it's not your fault nathggns/node-compass#29

from gulp-compass.

@contra I create issue on compass project. ref Compass/compass/issues/1499

from gulp-compass.

This is exactly why I didn't create a gulp task for Compass. Compass is inherently "designed" as an awful (slow) config mess. I predict nothing will be done about this upstream. I created grunt-contrib-compass and still regret it.

from gulp-compass.

@appleboy I'm confused about what the remaining issues are here (apart from the suckiness of compass itself).

Is there a test-case I could use to reproduce the problem?
Of master now the following is wfm (which I think fix the O.P. problem?):

gulp.src('src/**/*.{scss,css}')
  .pipe(compass({
      style: 'nested',
      sass: 'src',
      comments: true,
      logging: true
    }
  ))
  .pipe(map(function(file, cb){
    console.warn("This is triggered ->", file.path);
    console.warn(file.contents.toString('utf8'));
    cb(null, file);
  }));

Thanks!

from gulp-compass.

I have got an idea!

Currently the Compass does not provide an option to return the compiled CSS instead of writing it into the file...

The work-around:

1. Create a temporary directory (preferably in system's temp directory)
2. Force compass to build CSS there
3. Read the compiled CSS files into memory
4. Delete temporary files
5. Pipe files from memory

By the way, can we use compass watch to increase speed of compilation process (for watch tasks?

from gulp-compass.

@taai that's what gulp-ruby-sass does.

from gulp-compass.

@sindresorhus Great! I would like that with Compass too. By the way, can you tell me the difference between compass and sass --compass? The compass with all features is being used anyway, right? Or just the syntax?

from gulp-compass.

--compass flag enables the compass imports, but none of the conventions and settings.

from gulp-compass.