Does this work w/Compass' Recent Source Map Support? about gulp-compass HOT 19 CLOSED

+1

Trying to achieve the same thing. I've updated to sass 3.3.0 and compass 1.0.0.a19, but running gulp normally doesn't do the trick. Hope there's some workaround...

from gulp-compass.

@grayghostvisuals @namanyayg

Please update your sass, compass and gulp-compass as the following version

* sass (3.3.3)
* compass (1.0.0.alpha.19)
* gulp-compass (1.1.7)

from gulp-compass.

@appleboy

Compass 1.0.0.alpha.19
Sass 3.3.4
Ruby 2.1.1
Gulp-Compass 1.1.7
Gulp 3.5.5

Using the above versions with this config I don't get a .map file created for me.

from gulp-compass.

@grayghostvisuals where is your gulp-compass config?

https://github.com/grayghostvisuals/sourcemaps/blob/compass/gulp-compass/gulpfile.js

from gulp-compass.

@appleboy https://github.com/grayghostvisuals/sourcemaps/blob/compass/gulp-compass/gulpfile.js#L28-L41

That branch is setup to use gulp-compass and is listed in the package.json file https://github.com/grayghostvisuals/sourcemaps/blob/compass/gulp-compass/package.json#L6

from gulp-compass.

@appleboy
This issue is closed, but does not seem to be fixed. Would you mind reopening until the solution has been found and verified?

from gulp-compass.

@grayghostvisuals OK.

I will check your gulp config.

from gulp-compass.

Hi there,

I might be wrong but since compass' sourcemap flag only works used as a command line argument, gulp-compass currently doesn't allow to use a config.rb and sourcemap at the same time.

lib/compass.js#L72

if (opts.config_file) {
    options.push('-c', opts.config_file);
    //Support for environment
    if (opts.environment) { options.push('--environment', opts.environment); }
} else {
    [...]
    if (opts.sourcemap) { options.push('--sourcemap'); }
    [...]
}

from gulp-compass.

@appleboy Any status on this as of yet? I'm writing on this topic for CSS Tricks and would like to include this project as part of my article.

from gulp-compass.

@grayghostvisuals try the following config

gulp.src('css/src/styles.scss')
  .pipe(compass({
      sourcemap: true,
      debug : true,
      css: 'css',
      sass: 'css/src'
  }))
  .pipe(livereload(server))
  .pipe(gulp.dest('css'));

@griable is right.

Result:

$ ./node_modules/.bin/gulp  styles
[gulp] Using gulpfile /home/git/sourcemaps/gulpfile.js
[gulp] Starting 'styles'...
[gulp] gulp-compass: Running command: /usr/local/rvm/gems/ruby-2.1.1/bin/compass compile /home/git/sourcemaps /home/git/sourcemaps/css/src/styles.scss --relative-assets --debug-info --sourcemap --output-style nested --css-dir css --sass-dir css/src --images-dir images --javascripts-dir js --fonts-dir font
[gulp] /usr/local/rvm/gems/ruby-2.1.1/gems/bundler-1.5.3/lib/bundler/runtime.rb:220: warning: Insecure world writable dir /root in PATH, mode 040777

overwrite css/styles.css

   create css/styles.css.map

[gulp] Finished 'styles' after 672 ms

from gulp-compass.

@appleboy Yup. Commenting out the config_file line as @griable points out does in fact create a .map file, but I don't think that's a proper fix for this –do you?

from gulp-compass.

@grayghostvisuals Ya, I will try to fix it.

from gulp-compass.

@appleboy Awesome. I know it can certainly work without the config and setting it manually in the gulp file, but again it's nice to have the option than not at all. Thanks again for the help.

from gulp-compass.

@grayghostvisuals Please update to gulp-compass 1.1.9. It is working on your repository now. Please try it again.

from gulp-compass.

Excellent! Case closed. Thanks again for the work and help to get this running properly. Many peeps will appreciate it. 🍻

from gulp-compass.

I use [email protected] and no way - while transpililig SCSS file - sourcemap is not being generated, while it's so while using plain compass watcher.

This is my gulp:

gulp.task('compass', function() {
return gulp.src('app/sass/styles.scss')
.pipe(plumber())
.pipe(compass({
project: path.join(__dirname),
css: 'app/stylesheets',
sass: 'app/sass',
font: 'app/fonts',
image: 'app/images',
require: [
'bootstrap-sass',
'compass/import-once/activate'
],
sourcemap: true,
debug: true
}))
.on('error', function(error) {
console.log(error);
this.emit('end');
})
.pipe(plumber.stop())
.pipe(gulp.dest('app/stylesheets'));
});

This is so nasty as missing sourcemap is such a serious issue for a developer!!!

from gulp-compass.

Strange!!!

I have installed autoprefixer and problem seems to be gone!

from gulp-compass.

Hi Guys, here's my gulpfile.

gulp.task('css',function () {
    return gulp.src('sass/style.scss')
        .pipe(compass({
            sourcemap:true,
            debug:true,
            config_file:'./config.rb',
            css: './',
            sass:'sass'
        }))
        .pipe(postcss([autoprefixer({browsers: ['last 2 versions']})]))
        .pipe(gulp.dest(''))
});

I have sourcemap = true in my config.rb.

style.css.map is generated, but it's not loaded in the generated style.css. Is there something I'm missing?

Update:
So I tried removing postcss I do see the sourcemap now, but does compass do autoprefix automatically? Cause I'll need that feature.

from gulp-compass.

Compass has be deprecated in favor of eyeglass. It would be best if you don't use Compass anymore and go with another option like autoprefixer and LibSass.

from gulp-compass.