Gulp

Gulp

Gulpfile.js 설명

gulp.task('combine-js',['lint-js'], function(){
    return gulp.src('/public/js/**/*.js')
    .pipe(concat('all.js'))
    .pipe(gulp.dest('public/dist/js'));
});

gulp.task('default',['combine-js']);

• gulp.task(name, deps, func)
  • name - task의 이름을 지정하며, 이름에는 공백이 포함되어서는 안된다.
  • dept - 현재 선언하고 있는 task를 수행하기 전에 실행되는 task들
  • func - 실제 수행되는 내용
• gulp.src(files)
  • 대상 파일들 (배열이나 String)
  • ex) ['src/js/apple.js', 'src/js/hello.js', '!src/js/world.js'] <= !는 제외
• gulp.pipe(...)
  • task의 결과들의 결과물을 function으로 전달 (pipe로 연결되는 의미 추론)
• concat(최종 파일명)
  • src와 pipe를 통해서 결과물을 하나의 파일로 만들어 준다 (병합)
• gulp.task('default', [ 'task명' ])
  • default값으로 gulp만 명령어로 쳤을시 실행되는 task를 지정할수 있다.

Gulp 폴더 구조

node_modules/

public/
    src/
        index.html
        img/
        js/
        scss/
    dist/
        index.html
        img/
        js/
        css/
    lib/
        vanilla.js
        fancy.js

gulpfile.js
package.json

미리 dist(배포폴더)를 만들어서 프로젝트를 구성하자