일반적으로 콘솔에서 gulp 작업을 다음과 같은 방법으로 실행할 수 있습니다 gulp mytask. 어쨌든 gulp 작업에 매개 변수를 전달할 수 있습니까? 가능하면 어떻게 할 수 있는지 예를 보여주십시오.

답변

없이는 프로그램을 유지할 수없는 기능입니다. 당신은 yargs 를 시도 할 수 있습니다 .

npm install --save-dev yargs

다음과 같이 사용할 수 있습니다.

gulp mytask --production --test 1234

코드에서 예를 들면 다음과 같습니다.

var argv = require('yargs').argv;
var isProduction = (argv.production === undefined) ? false : true;

당신의 이해를 돕기 위해:

> gulp watch
console.log(argv.production === undefined);  <-- true
console.log(argv.test === undefined);        <-- true

> gulp watch --production
console.log(argv.production === undefined);  <-- false
console.log(argv.production);                <-- true
console.log(argv.test === undefined);        <-- true
console.log(argv.test);                      <-- undefined

> gulp watch --production --test 1234
console.log(argv.production === undefined);  <-- false
console.log(argv.production);                <-- true
console.log(argv.test === undefined);        <-- false
console.log(argv.test);                      <-- 1234

여기에서 가져갈 수 있기를 바랍니다.

사용할 수있는 또 다른 플러그인 인 minimist가 있습니다. yargs와 minimist에 대한 좋은 예가있는 또 다른 게시물이 있습니다. ( 다른 방법으로 작업을 실행하도록 Gulp에 플래그를 전달할 수 있습니까? )

답변

추가 종속성을 추가하지 않으려면 노드 process.argv가 유용하다는 것을 알았습니다 .

gulp.task('mytask', function() {
    console.log(process.argv);
});

그래서 다음과 같이 :

gulp mytask --option 123

표시되어야합니다 :

[ 'node', 'path/to/gulp.js', 'mytask', '--option', '123']

원하는 매개 변수가 올바른 위치에 있다고 확신하면 플래그가 필요하지 않습니다. **이 경우 다음을 사용하십시오.

var option = process.argv[4]; //set to '123'

그러나 옵션이 설정되지 않았거나 다른 위치에있을 수 있으므로 더 나은 아이디어는 다음과 같습니다.

var option, i = process.argv.indexOf("--option");
if(i>-1) {
    option = process.argv[i+1];
}

이렇게하면 다음과 같은 여러 옵션의 변형을 처리 할 수 있습니다.

//task should still find 'option' variable in all cases
gulp mytask --newoption somestuff --option 123
gulp mytask --option 123 --newoption somestuff
gulp mytask --flag --option 123

** 편집 : 노드 스크립트의 경우 true이지만 gulp는 앞에 “-“가없는 것을 다른 작업 이름으로 해석합니다. 따라서 gulp mytask 123gulp에서 ‘123’이라는 작업을 찾을 수 없으므로 사용 이 실패합니다.

답변

꿀꺽 꿀꺽 매개 변수를 전달하면 몇 가지를 의미 할 수 있습니다.

명령 행에서 gulpfile로 (이미 여기에 예시되어 있음)
gulpfile.js 스크립트의 본문에서 gulp 작업까지
한 번의 과업에서 다른 과업으로.

다음은 기본 gulpfile에서 gulp 작업으로 매개 변수를 전달하는 방법입니다. 매개 변수가 필요한 작업을 자체 모듈로 이동하고 함수에 래핑하여 매개 변수를 전달할 수 있습니다.

// ./gulp-tasks/my-neat-task.js file
module.exports = function(opts){

  opts.gulp.task('my-neat-task', function(){
      console.log( 'the value is ' + opts.value );
  });

};

//main gulpfile.js file

//...do some work to figure out a value called val...
var val = 'some value';

//pass that value as a parameter to the 'my-neat-task' gulp task
require('./gulp-tasks/my-neat-task.js')({ gulp: gulp, value: val});

이것은 많은 펄프 작업이 있고 편리한 환경 설정을 전달하고자 할 때 유용 할 수 있습니다. 한 작업과 다른 작업 사이에서 작동하는지 확실하지 않습니다.

답변

minimist 사용하여 공식 꿀꺽 꿀꺽 레시피가 있습니다.

https://github.com/gulpjs/gulp/blob/master/docs/recipes/pass-arguments-from-cli.md

기본 사항은 minimist를 사용하여 cli 인수를 분리하고 알려진 옵션과 결합합니다.

var options = minimist(process.argv.slice(2), knownOptions);

다음과 같은 것을 파싱 할 것입니다.

$ gulp scripts --env development

레시피에서 더 완전한 정보.

답변

로그와 같은 환경 매개 변수 및 기타 유틸리티를 사용하려면 gulp-util을 사용할 수 있습니다

/*
  $npm install gulp-util --save-dev
  $gulp --varName 123
*/
var util = require('gulp-util');
util.log(util.env.varName);

최신 정보

gulp-util은 더 이상 사용되지 않습니다. 대신 미니멀 을 사용할 수 있습니다 .

var argv = require('minimist')(process.argv.slice(2));
console.dir(argv);

답변

@ Ethan의 대답은 완전히 작동합니다. 내 경험상 더 노드 방법은 환경 변수를 사용하는 것입니다. 호스팅 플랫폼 (예 : Heroku 또는 Dokku)에 배포 된 프로그램을 구성하는 표준 방법입니다.

명령 행에서 매개 변수를 전달하려면 다음과 같이하십시오.

개발:
gulp dev

생산:
NODE_ENV=production gulp dev

문법은 다르지만 매우 유닉스이며 Heroku, Dokku 등과 호환됩니다.

코드에서 변수에 액세스 할 수 있습니다 process.env.NODE_ENV

MYAPP=something_else gulp dev

설정

process.env.MYAPP === 'something_else'

이 답변 은 다른 아이디어를 줄 수 있습니다.

답변

사용 방법은 다음과 같습니다. CSS / less 작업의 경우. 모두에게 적용 할 수 있습니다.

var cssTask = function (options) {
  var minifyCSS = require('gulp-minify-css'),
    less = require('gulp-less'),
    src = cssDependencies;

  src.push(codePath + '**/*.less');

  var run = function () {
    var start = Date.now();

    console.log('Start building CSS/LESS bundle');

    gulp.src(src)
      .pipe(gulpif(options.devBuild, plumber({
        errorHandler: onError
      })))
      .pipe(concat('main.css'))
      .pipe(less())
      .pipe(gulpif(options.minify, minifyCSS()))
      .pipe(gulp.dest(buildPath + 'css'))
      .pipe(gulpif(options.devBuild, browserSync.reload({stream:true})))
      .pipe(notify(function () {
        console.log('END CSS/LESS built in ' + (Date.now() - start) + 'ms');
      }));
  };

  run();

  if (options.watch) {
    gulp.watch(src, run);
  }
};

gulp.task('dev', function () {
  var options = {
    devBuild: true,
    minify: false,
    watch: false
  };

  cssTask (options);
});