꿀꺽 꿀꺽함 작업은 내가 특별히 저장 한 파일을 놓치고 나머지는 모두 빌드합니다.

Question

나는 서버 제거시 꿀꺽 꿀꺽 마시고 watcher가 켜져있는 js 및 scss에 대한 작업을 받았습니다. 텍스트 편집기에 파일을 저장할 때마다 서버로 보내져 watcher가 파일 변경을보고 작업을 시작하지만 거의 언제나 컴파일 된 파일에서 방금 저장 한 파일이 누락됩니다.

그게 무슨 뜻입니까, 나는 main.scss에 모두 포함되어있는 여러 _example.scss를 가지고 있으며, 방금 컴파일 한 모든 _example.scss 파일의 스타일을 출력 할 것입니다. .

이는 JS 및 SASS 작업 모두에서 발생하지만 watcher가 작업을 시작할 때만 발생합니다. Gulp을 중지하고 시작하면 모든 파일이 컴파일됩니다.

는 여기에 내가 터미널에서 오류를 얻을, 그것은 명확하게하려면 gulpfile.js

var gulp = require('gulp'); 
var gutil = require('gulp-util'); 
var gulpif = require('gulp-if'); 
var autoprefixer = require('gulp-autoprefixer'); 
var sass = require('gulp-sass'); 
var cleanCSS = require('gulp-clean-css'); 
var concat = require('gulp-concat'); 
var plumber = require('gulp-plumber'); 
var buffer = require('vinyl-buffer'); 
var source = require('vinyl-source-stream'); 
var babelify = require('babelify'); 
var browserify = require('browserify'); 
var watchify = require('watchify'); 
var uglify = require('gulp-uglify'); 
var sourcemaps = require('gulp-sourcemaps'); 
var transform = require('vinyl-transform'); 
var streamify = require('gulp-streamify'); 

/* 
|-------------------------------------------------------------------------- 
| Same as browserify task, but will also watch for changes and re-compile. 
|-------------------------------------------------------------------------- 
*/ 
gulp.task('js', function() { 
    return browserify('./js/main.js') 
     .transform(babelify, {presets: ["es2015"]}) 
     .bundle() 
     .on('error', function(e) { 
      gutil.log(e); 
     }) 
     .pipe(source('bundle.js')) 
     .pipe(streamify(uglify())) 
     .pipe(gulp.dest('./js/build')); 
}); 

/* 
|-------------------------------------------------------------------------- 
| Compile LESS stylesheets. 
|-------------------------------------------------------------------------- 
*/ 
gulp.task('styles', function() { 
    return gulp.src('./scss/main.scss') 
    .pipe(sass.sync().on('error', sass.logError)) 
    .pipe(cleanCSS()) 
    .pipe(gulp.dest('./css')); 
}); 

gulp.task('watch', function() { 
    gulp.watch('./scss/**/*.scss', ['styles']); 
    gulp.watch('./js/components/*.js', ['js']); 
    gulp.watch('./js/*.js', ['js']); 
}); 

gulp.task('default', ['styles', 'js', 'watch']); 

입니다. 내 결과는 다음과 같습니다. 대답을 찾고 여기 오는 사람들을 위해

[15:45:50] Using gulpfile /example/path/to/gulpfile.js 
[15:45:50] Starting 'styles'... 
[15:45:50] Starting 'js'... 
[15:45:50] Starting 'watch'... 
[15:45:50] Finished 'watch' after 17 ms 
[15:45:50] Finished 'styles' after 221 ms 
[15:45:53] Finished 'js' after 2.86 s 
[15:45:53] Starting 'default'... 
[15:45:53] Finished 'default' after 4.96 μs 

Answer 1

, 당신은이 질문의 대답을 참조 할 수 있습니다 gulp.watch() not working with ftp update

TL; DR FTP 전송 프로토콜 먼저이의 나머지를 보낼 수 있습니다 확인하는 패킷을 전송 파일. 초기 패킷은 GULP 작업을 트리거하고 현재 비어있는 파일을 컴파일합니다. 네트워크 속도가 느릴수록 전송에 오래 걸립니다. '수정'은 파일을 컴파일하기 전에 특정 시간 동안 작업을 지연시키는 것입니다. https://www.npmjs.com/package/gulp-wait을 사용했지만 다른 사람들이 트릭을 할 수 있다고 확신합니다.