Gulp는 자바스크립트 빌드 도구로 널리 사용되며, 사용자 입력을 처리하는 기능도 제공합니다. 이 기능을 사용하면 사용자의 입력에 따라 자바스크립트 파일을 다르게 처리하거나 실행할 수 있습니다.

Gulp 플러그인 설치

먼저, Gulp를 사용하여 사용자 입력을 처리하기 위해 필요한 Gulp 플러그인을 설치해야 합니다. 이 예제에서는 gulp-prompt 플러그인을 사용하겠습니다. 다음과 같이 명령어를 실행하여 플러그인을 설치합니다.

npm install gulp-prompt --save-dev

Gulpfile 설정

Gulpfile에는 사용자 입력을 처리하는 기능을 추가해야 합니다. 예를 들어, 사용자로부터 파일을 선택하는 입력을 받고 해당 파일을 처리하는 작업을 수행하도록 설정할 수 있습니다.

const gulp = require('gulp');
const prompt = require('gulp-prompt');

gulp.task('process', () => {
  return gulp.src('src/*.js')
    .pipe(prompt.prompt({
      type: 'input',
      name: 'filename',
      message: 'Enter the file name to process:',
    }, (res) => {
      console.log('Processing file:', res.filename);
      // 파일 처리 작업 수행
    }));
});

gulp.task('default', gulp.series('process'));

위 코드를 보면, gulp-prompt 플러그인의 prompt.prompt() 메서드를 사용하여 사용자로부터 파일 이름을 입력 받고, 입력된 파일을 처리하는 작업을 수행하도록 설정하였습니다.

Gulp 실행

설정이 완료되었으면, 아래의 명령어를 실행하여 Gulp를 실행합니다.

gulp

실행하면 프롬프트가 나타나고, 원하는 파일 이름을 입력할 수 있습니다. 입력된 파일을 처리하는 작업이 수행될 것입니다.

결론

Gulp를 사용하여 자바스크립트 파일의 사용자 입력을 처리하는 방법을 알아보았습니다. gulp-prompt 플러그인을 통해 사용자로부터 입력을 받아 처리하는 기능을 구현할 수 있습니다. 이를 활용하여 자바스크립트 파일을 동적으로 처리하거나 실행하는 등 다양한 작업을 수행할 수 있습니다.

참고: gulp-prompt 공식 문서