2017-05-21 23 views
0

私はgulpfiles.jsでタスクを作成しましたが、ファイルを作成するときに問題があります。.scssを実行し、bashでコマンドgulpを作成します。エラーはありませんが、cssフォルダにはファイルがありません。私はbashで、このコードapeearing:GulpがCSSファイルを作成しないのはなぜですか?

C:\Users\DOM\Desktop\react\my-react-project>gulp 
[16:33:25] Using gulpfile ~\Desktop\react\my-react-project\gulpfile.js 
[16:33:25] Starting 'watch_scss'... 
[16:33:25] Finished 'watch_scss' after 13 ms 
[16:33:25] Starting 'default'... 
[16:33:25] Finished 'default' after 12 μs 

これはgulpfile.jsから私のコードです:

'use strict'; 

    //dependencies 
    var gulp = require('gulp'); 
    var sass = require('gulp-sass'); 
    var minifyCSS = require('gulp-clean-css'); 
    var uglify = require('gulp-uglify'); 
    var rename = require('gulp-rename'); 
    var changed = require('gulp-change'); 




    ///////////////////////////////// 
    // - SCSS/CSS 
    //////////////////////////////// 

    var SCSS_SRC = './src/Assets/scss/**/*.scss'; 
    var SCSS_DEST = './src/Assets/css'; 

    //Compile SCSS 
    gulp.task('compile_scss',function() { 

    gulp.src(SCSS_SRC) 
    .pipe(sass().on('error', sass.logError)) 
    .pipe(minifyCSS()) 
    .pipe(rename({suffix:'.min'})) 
    .pipe(changed(SCSS_DEST)) 
    .pipe(gulp.dest(SCSS_DEST)); 
    }); 


    //Detect changes in SCSS 
    gulp.task('watch_scss', function(){ 
    gulp.watch(SCSS_SRC, ['compile_scss']); 
    }); 


    //Run tasks 
    gulp.task('default', ['watch_scss']); 

私のミスがどこにあるか、私は見つけることができません。

答えて

0

gulp.watch'compile_scss'は、SCSS_SRCで定義されたdirのファイルを変更した場合にのみ実行されます。 gulpがそこにファイルの何か変更を見るまで - gulp.watchは何もしません。試してくださいgulp.task('default', ['compile_scss', 'watch_scss']);。そして、gulp-syncプラグインを使用して、'compile_scss', 'watch_scss'のタスクを順番に実行することをお勧めします。私が推奨したようにデフォルトタスクを変更すると、これらの2つのタスクは並行して実行されます。

+0

ありがとうございます。しかし、私がscssファイルのsthを変更しても、何の効果もありません。私の目的地は空です。私はあなたが言ったことをやっているし、私はしようとしました:gulp.task( 'default'、['compile_scss'、 'watch_scss']);しかし、私はエラーがあります:TypeError:run.callは関数ではありません。 gulp compile_scssを直接実行すると、同じエラーが発生します。typeError:run.callは関数ではありません。 – Malwafro

+0

私も、以前のコードは表示されないので、比較することはありません。D –

0

私はこのコード:

var gulp = require('gulp'); 


//var jshint = require('gulp-jshint'); 
var sass = require('gulp-sass'); 
var uglify = require('gulp-uglify'); 
var rename = require('gulp-rename'); 
var minifyCSS = require('gulp-clean-css'); 

var SRC = './src/Assets/scss/**/*.scss'; 
var DEST = './src/Assets/css/'; 

gulp.task('styles', function() { 
    gulp.src(SRC) 
     .pipe(sass().on('error', sass.logError)) 
     .pipe(minifyCSS()) 
     .pipe(rename({suffix:'.min'})) 
     .pipe(gulp.dest(DEST)); 
}); 

//Watch task 
gulp.task('default',function() { 
    gulp.watch(SRC,['styles']); 
}); 

とすべてが機能しますが、私にはわかりません。

関連する問題