0

I have got a gulp file with lost package installed however it seems that the css is not compiled properly when running my task.

var gulp = require('gulp'),
    $ = require('gulp-load-plugins')({ lazy: true }),
    browsersync = require('browser-sync'),
    del = require('del'),
    config = require('./config.js')(),
    plumber = require('gulp-plumber'),
    newer = require('gulp-newer'),
    jshint = require('gulp-jshint'),
    jade = require('gulp-jade'),
    concat = require('gulp-concat'),
    size = require('gulp-size'),
    uglify = require('gulp-uglify'),
    deporder = require('gulp-deporder'),
    stripDebug = require('gulp-strip-debug'),
    postcss = require('gulp-postcss'),
    autoprefixer = require('autoprefixer'),
    lost = require('lost'),
    minifyCss = require('gulp-minify-css'),
    sass = require('gulp-ruby-sass'),
    sourcemaps = require('gulp-sourcemaps');

My gulp task is the following:

gulp.task('sass', function () {

  var processors = [
    lost(),
    autoprefixer({browsers:['last 2 versions']})
  ];
  return gulp.src(styles.in)
      .pipe($.plumber())
      .pipe(postcss(processors))
      .pipe($.sass(styles.sassOpt))
      .pipe($.size({ title: 'styles In Size' }))
      .pipe($.size({ title: 'styles Out Size' }))
      .pipe(gulp.dest(styles.out))
      .pipe(browsersync.reload({ stream: true }));
  log('-> Compile SASS Styles')
});

Help would be much appreciated, Thank you very much in advance!

Edit: The CSS output is not what is expected. For example the CSS is rendered as: .grid-one lost-utility: clearfix with: 100% div lost-column: 1/6

JWip
  • 1
  • 1
  • "Doesn't work" doesn't explain the problem. Is there an error? What is the error? Do you get a different output than you expected? Does it launch nuclear missiles? – cimmanon Feb 15 '16 at 16:44
  • Apologies for not being precise, the calc() functions are not being rendered. When I try to use the lost functions .column lost-column: 1/4 the Sass then CSS is rendered like that: .column { lost-column: 1/4;} – JWip Feb 15 '16 at 17:00
  • So then your question has nothing to do with Sass? Because Sass has nothing to do with the output being generated wrong (feeding it an ordinary CSS file would have the same results). – cimmanon Feb 15 '16 at 17:05
  • I don't know where the error lies, the sass is being generated into the right css but not the lost functions – JWip Feb 15 '16 at 18:41

1 Answers1

0

Silly mistake my postcss task was watching a .sass file rather than a .css ...

JWip
  • 1
  • 1