2017-01-07 8 views
0

私はbootstrap.cssファイルに私のbootstrap.lessファイルをコンパイルするためにGulpを使用しています。すべてのブートストラップのLESSファイルは "less"フォルダにあり、すべてのCSSファイルはCSSフォルダにあります。ブートストラップの少ないファイルはすべて、bootstrap.lessに@ import'dされ、そのファイルはbootstrap.cssにコンパイルされます。しかし、私はbootstrap LESSフォルダにあるcustom.lessファイルを1つ持っています。私は、CSSフォルダー内のcustom.cssファイルにコンパイルしたいと思います。私はGulpにこれをさせることができません。ここに私のコードです。GulpはCSS複数のsrcをコンパイルします

var gulp  = require('gulp'); 
var less  = require('gulp-less'); 
var browserSync = require('browser-sync').create(); 

gulp.task('less', function() { 
return gulp.src(['./less/bootstrap.less', './less/custom.less']) 
    .pipe(less()) 
    .pipe(gulp.dest("./css")) 
    .pipe(browserSync.reload({stream: true})); 
}); 

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

     browserSync.init({ 
      server: { 
       baseDir: './' 
      } 
     }); 

gulp.watch('./less/*.less', ['less']); 
gulp.watch(['./**/*.html', './js/custom.js']).on('change', 
browserSync.reload); 

}); 

gulp.task('default', ['less', 'serve']); 
+0

あなたはこのように何をしている場合:gulp.task(「少ない」、機能(){ リターンgulp.src([」./.pipe(less()) .pipe(gulp.dest( "./ css/custom.css")) .pipe(browserSync.reload({stream:true}) ); }); –

+0

私の少ないファイルすべてをcustom.cssにパイプしませんか?私は、すべてのboostrap.lessファイルをbootstrap.cssにコンパイルし、custom.ssをcustom.cssに個別にコンパイルしたいと考えています。 – mriccelli75

答えて

0

私が通常行っているのは、すべての.lessまたは.scssファイルをcssフォルダにコンパイルすることです。いくつかの空のファイルがあります(良い例としては、変数を含むファイルはありません)。一方、それらのファイルを消去するためのgulpタスクを作成することができます。私は次のコードを使用してコンパイルします:

return gulp.src("Styles/scss/*.scss") 
    .pipe(sourcemaps.init()) 
    .pipe(sass()) 
    .pipe(sourcemaps.write('.')) 
    .pipe(gulp.dest("Styles/css")) 
    .pipe(reload({stream: true})); 

私はここでもソースマップを生成していますが、それを削除することもできます。あなたはより多くのチェックアウトthis post here

希望を発見したい場合、これは役立ちます。)

関連する問題