Gulp의 "파이프" 사이에 변수 전달하기

StackOverflow https://stackoverflow.com//questions/22026389

  •  21-12-2019
  •  | 
  •  

문제

나는 꿀꺽꿀꺽 프롬프트 플러그인.하지만 해당 입력을 다른 예에 전달하는 데 문제가 있습니다.

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

    var myVar = 'MONKEY';

    gulp.src('./templates/_component.*')
    .pipe(prompt.prompt([
        {
            type: 'input',
            name: 'userInput',
            message: 'Say something'
        }
    ], function(res){
        myVar = res.userInput;
    }))
    .pipe(prompt.confirm('You said ' + myVar));
});

내가 들어간다고 가정하면 hello 프롬프트에서 나는 다음과 같은 확인 메시지를 기대하고 있었습니다. You said Hello, 그러나 그것은 말한다 You said MONKEY.

Gulp로 이것이 가능합니까?

도움이 되었습니까?

해결책

여기서 문제는 두 번째 프롬프트('You said ' + myVar) ~ 전에 첫 번째 프롬프트가 실행되었습니다:

  1. 세트 myVar 에게 'MONKEY'
  2. 스트림 생성
    1. 만들다 src 비동기식 스트림
    2. 첫 번째 프롬프트를 생성하고 src 스트림에 추가합니다.
    3. 현재 값을 사용하여 두 번째 프롬프트 생성 myVar, 첫 번째 프롬프트 스트림에 추가
  3. 이제 실행된 스트림만 처리됩니다.
    1. 소스 로드
    2. 첫 번째 프롬프트를 실행하고 myVar
    3. 이전에 생성된 메시지를 사용하여 두 번째 프롬프트를 실행합니다.

모든 것을 단일 스트림으로 유지하려는 경우 유일한 해결책은 클로저(함수)를 허용하는 항목 내에서 변수를 사용하는 것입니다.일부 플러그인은 이미 클로저를 인수로 허용하지만 대부분은 그렇지 않습니다.

여기서 작동하는 클로저로 스트림을 래핑하는 한 가지 솔루션은 다음과 같습니다. 꿀꺽꿀꺽, 이는 이 시나리오를 위해 특별히 설계된 것은 아니지만 작동해야 합니다.그것은 다음과 같습니다

var tap = require('gulp-tap');

//...

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

    var myVar = 'MONKEY';

    gulp.src('./templates/_component.*')
    .pipe(prompt.prompt([
        {
            type: 'input',
            name: 'userInput',
            message: 'Say something'
        }
    ], function(res){
        myVar = res.userInput;
    }))
    .pipe(tap(function(file, t) {
        // format is t.through(stream-function, [arguments...])
        return t.through(prompt.confirm, ['You said ' + myVar]);
    });
});

이는 클로저로 래핑되고 각 파일에 대해 평가되기 때문에 현재의 변수의 값입니다. 그러나 각 파일에서 작동하기 때문에 다음 메시지가 한 번만 표시됩니다. 각 파일이 처리되었습니다.

더 나은 해결책은 작업을 여러 개의 종속 작업으로 분리하는 것입니다.다음과 같이 보일 것입니다:

var myVar = 'MONKEY';

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

    return gulp.src('./templates/_component.*', {read: false})
        .pipe(prompt.prompt([
            {
                type: 'input',
                name: 'userInput',
                message: 'Say something'
            }
        ], function(res){
            myVar = res.userInput;
        }));
});

gulp.task('userinput', ['userinput1'], function() {
    return gulp.src('./templates/_component.*')
        .pipe(prompt.confirm('You said ' + myVar));
});

이제 첫 번째 작업(userinput1)가 실행되고 완료됩니다. ~ 전에 두 번째 것은 처리됩니다(userinput2), 변수가 올바르게 설정됩니다.

메모: 당신을 확인하십시오 return 그렇지 않으면 동기식으로 처리되어 변수가 설정되지 않습니다.

마지막으로, 포기하는 것이 더 합리적일 수 있습니다. gulp-prompt 실제로 스트림과 많은 관련이 없기 때문에 작업 전체입니다.작업 내에서 직접 Node JavaScript를 사용하여 사용자 입력을 수집하고(바람직하게는 동기식으로) 파일을 꿀꺽꿀꺽 스트림으로 처리하는 것이 더 나을 것입니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top