programing tip

Gulp.js-gulp.dest ()에서 gulp.src ()의 경로 사용

itbloger 2021. 1. 11. 07:43
반응형

Gulp.js-gulp.dest ()에서 gulp.src ()의 경로 사용


LESS를 통해 여러 폴더의 파일을 파이프 한 다음 원본 소스를 기반으로 폴더로 출력하는 꿀꺽 꿀꺽 작업을 만들려고합니다. 다음 폴더 구조를 고려하십시오.

Project
+-- /Module_A
|   +- /less
|   |  +- a.less
|   +- a.css
|
+-- /Module_B
    +- /less
    |  +- b.less
    +- b.css

내 gulpfile은 다음과 같습니다.

var gulp = require('gulp');
var gutil = require('gulp-util');
var less = require('gulp-less');

gulp.task('compileLess', function () {
  gulp.src('./*/less/*.less')
    .pipe(less())
    .pipe(gulp.dest( ??? ));
});

gulp.task('default', ['compileLess']);

gulp.dest ()는 경로가 전달 될 것으로 예상하지만 내 예제에서는 경로가 소스 파일에 따라 달라진다는 것을 알고 있습니다. 그렇다면 소스에서 경로를 가져 와서 수정 한 다음 gulp.dest ()에 전달하려면 어떻게해야합니까?

아니면 잘못된 방향으로 가고 있습니까?


gulp-rename을 봐야합니다.

꽤 많이 :

gulp.src('./*/less/*.less')
  .pipe(less())
  .pipe(rename(function(path){
    // Do something / modify the path here         
  }))
  .pipe(gulp.dest('./finalRootDestination'))

최종 출력 디렉토리를 가리키는 gulp.dest를 남겨두고 gulp-rename 콜백 내에서 원하는 논리에 따라 개별 파일 경로를 즉시 수정하십시오.


당신에 src설정합니다 base옵션과 당신의 작은 파일의 원래 경로를 유지합니다.

gulp.task('compileLess', function () {
  gulp.src('./*/less/*.less', {base: './'})
    .pipe(less())
    .pipe(gulp.dest( './dist' ));
});

./dist대상은 무엇이든 할 수있다. 파일 구조를 배치하려는 위치.

추가 정보 : https://github.com/wearefractal/glob-stream#options

참조 URL : https://stackoverflow.com/questions/22240977/gulp-js-use-path-from-gulp-src-in-gulp-dest

반응형