2014-09-12 28 views
5

corsa Sass 3.4.3, bussola 1.0.1, Gulp 3.8.8 e Gulp compasso 1.3.1Gulp-bussola comprimendo sass non funzionante

gulp.task('compass', function() { 
    gulp.src('comp/sass/style.scss') 
     .pipe(compass({ 
      sass: 'comp/sass', 
      image: 'dev/theme/images', 
      style: 'compressed' 
     }) 
     .on('error', gutil.log)) 
     .pipe(gulp.dest('dev/theme/css')) 
}); 

bussola Task è compilando il sass ma la compressione non funziona. Emette un normale file css non compresso.

risposta

0

Quello che hai dovrebbe funzionare, ma penso che il plugin gulp-compass sia un po 'buggato con le proprietà di configurazione. Funziona in modo coerente per me con lo stile di output in un file config.rb separato.

var gulp = require('gulp'); 
var compass = require('gulp-compass'); 
var gutil = require('gulp-util'); 

gulp.task('compass', function() { 
    return gulp.src('comp/sass/style.scss') 
     .pipe(compass({ 
      config_file: 'config.rb', 
      sass: 'comp/sass', 
      image: 'dev/theme/images' 
     }) 
     .on('error', gutil.log)) 
     .pipe(gulp.dest('dev/theme/css')) 
    ; 
}) 

Con questo nel file config.rb:

output_style = :compressed 
+0

Purtroppo questo non ha funzionato per me. Sto usando sass 3.4.13 e gulp-compass 2.0.3. – koenpeters

+1

Ho lo stesso problema e ho anche provato a suggerire di utilizzare un file di configurazione di Ruby. Non ha funzionato neanche per me. – Kenny

1

Ho avuto lo stesso problema con il seguente:

gulp.task('compass', function() { 
    gulp.src(sassSources) 
    .pipe(compass({ 
     sass: 'components/sass', 
     image: outputDir + '/images', 
     style: sassStyle 
    })) 
    .on('error', gutil.log) 
    .pipe(gulp.dest(outputDir + '/css')) 
    .pipe(connect.reload()) 
}); 

Nota che c'è questa sassStyle variabile definita condizionalmente in questa prossima porzione di codice dove il processo node.js process.env sta 'guardando' il valore NODE_ENV in modo che possiamo passare dalla cartella di produzione alla cartella di sviluppo:

env = process.env.NODE_ENV || 'development'; 
if (env ==='development') { 
    outputDir = 'builds/development/'; 
    sassStyle = 'expanded'; 
} else { 
    outputDir = 'builds/production/'; 
    sassStyle ='compressed'; 
} 

Non ha fatto il trucco, ma un file config.rb esterna modificato manualmente con:

config_file: 'config.rb', 

con questa linea nel file lavorato:

output_style = :compressed 

Per ora, ho appena lasciato queste righe commentate nel file come soluzione alternativa.

Sto utilizzando i seguenti devDependencies:

"devDependencies": { 
    "gulp": "^3.9.1", 
    "gulp-browserify": "^0.5.1", 
    "gulp-coffee": "^2.3.2", 
    "gulp-compass": "^2.1.0", 
    "gulp-concat": "^2.6.0", 
    "gulp-connect": "^5.0.0", 
    "gulp-util": "^3.0.7", 
    "jquery": "^3.1.0", 
    "mustache": "^2.2.1" 
    } 
+0

Presumo che ciò avvenga dal corso dei flussi di lavoro del progetto Web Lynda.com. Dove hai scritto 'config_file: 'config.rb','? – ihodonald