2014-07-10 5 views
2

저는 Gulp로 작업 흐름을 옮기는 작업을하고 있습니다. 그러나, 나는 ...gulp-filter가 모든 파일을 걸러냅니다.

을 꿀꺽 필터 플러그인의 작동 방식에 대한 오해 뭔가를 갖고있는 것 같다 나는 다음과 같은 작업이 다음과 같이 내가 정의되어 사용하고

gulp.task('assets', function() { 
    var stylesFilter = gulpFilter(stylesPath); 
    var imagesFilter = gulpFilter(imagesPath); 
    var scriptsFilter = gulpFilter(scriptsPath); 

    return gulp.src([].concat('app/**/*.html', stylesPath, imagesPath, scriptsPath)) 
     // STYLES 
     .pipe(stylesFilter) 
     .pipe(gulp.dest('dist/test_styles')) // For debugging! 
     .pipe(sass({style: 'expanded' })) 
     .pipe(autoPrefixer('> 1%', 'last 3 versions', 'Firefox ESR', 'Opera 12.1')) 
     .pipe(concat('main.css')) 
     .pipe(minifyCss()) 
     .pipe(rev()) 
     .pipe(revReplace()) 
     .pipe(gulp.dest('dist/css')) 
     .pipe(stylesFilter.restore()) 

     // SCRIPTS 
     .pipe(scriptsFilter) 
     .pipe(gulp.dest('dist/test_scripts')) // For debugging! 
     .pipe(jsHint('.jshintrc')) 
     .pipe(jsHint.reporter('jshint-stylish')) 
     .pipe(concat('app.js')) 
     .pipe(uglify()) 
     .pipe(rev()) 
     .pipe(revReplace()) 
     .pipe(gulp.dest('dist/js')) 
     .pipe(scriptsFilter.restore()) 

     // IMAGES 
     .pipe(imagesFilter) 
     .pipe(gulp.dest('dist/test_images')) // For debugging! 
     .pipe(cache(imageMin({ optimizationLevel: 7, progressive: true, interlaced: true }))) 
     .pipe(rev()) 
     .pipe(revReplace()) 
     .pipe(gulp.dest('dist/img')) 
     .pipe(imagesFilter.restore()); 
}); 

경로 변수 :

var stylesPath = [ 
    'bower_components/foundation/scss/normalize.scss', 
    'bower_components/foundation/scss/foundation.scss', 
    'app/styles/app.scss' 
], 
scriptsPath = [ 
    'app/scripts/**/*.js', 
    '!app/scripts/**/*_test.js' 
], 
imagesPath = [ 
    'app/images/**/*' 
]; 

내 문제는 그 stylesFilter, imagesFilter이며, scriptsFilter모든를 필터링하고 있습니다! 위의 작업에서 "디버깅"으로 표시된 줄을 추가하여 각 필터링 된 섹션에서 작업중인 파일을 확인하려고 시도했습니다. 모두 파일이 필터링되고 있습니다 (즉, 파일이 기록되지 않습니다. 디스크 위에 gulp.dest() 문을 디버깅 용으로 표시). .pipe(*Filter.restore()) 행 뒤에 파일을 출력하는 행을 추가하면 원래 입력 (올바른 파일 임)에서 모든 파일을 출력합니다. 좋은 측정을 위해 필터에 대해 음수 패턴을 사용해 보았지만 그 결과는 똑같습니다.

그래서 나는 무엇을 놓치고 있습니까? 왜 도 필터에 의해 반환되지 않습니다.?

답변

6

OK, 그래서 나는이 문제의 원인을 발견했습니다 :

gulp-filter이 장면 뒤에 multimatch 모듈을 사용, 그리고 그것이 읽고 파일에 대한 비닐 파일 객체를 사용하며,이 multimatch 기능에 File.relative 전달 (File.base에 대한 상대 경로이며 첫 번째 glob과 같습니다). 그래서 'bower_components/foundation/scss/normalize.scss'을 glob로 사용했을 때 File.relative에는 파일 이름 만 포함되어 있었고 'bower_components/foundation/scss/normalize.scss''normalize.scss'과 일치하지 않습니다.

1

파이프 라인이 너무 길어서 관련이없는 것들을 처리하려고 시도합니다.

나는 병렬로 실행되는 다른 작업에서 자산 유형별로 파이프 라인을 시작하려고합니다.

+0

일반적으로 나는 당신과 동의 할 것입니다; 실제로'gulp-rev'와'gulp-rev-replace' 플러그인을 사용하기 때문에 이것을 3 가지 작업으로 분리 할 수 ​​있다고 생각하지 않습니다. .html 파일을 읽고 버전이있는 이름으로 자산 파일에 대한 참조를 업데이트해야하며, 3 가지 작업이 병렬로 실행되는 경우 각각의 .html 파일을 확인하기위한 방법은 없습니다 (또는별로 좋지 않은 추악한 방법이 아님). 파일을 읽고, 업데이트하고, 다른 작업이 동일한 작업을 시도하기 전에 쓰십시오 (task1이 그것을 읽을 수 있고 task2를 누른 다음 task1이 변경 사항을 기록 할 수 있고 task2는 task1이 수행 한 작업을 덮어 씁니다). –