작업 러너 빈 템플릿 (Grunt · Gulp)

2547 단어 gruntgulp
WEB 사이트제작 태스크 러너의 빈 템플릿을 만들었습니다.
Grunt 기반 HTML5 사이트 제작 템플릿 2014년 11월 버전
라고 하는 것을 이전 만들었습니다만 이번은 구체적인 컴파일용 플러그인은 포함하지 않고
아래 태스크 러너 플로우를 Grunt·Gulp 양쪽에서 구현했습니다.




디렉토리
설명


_release
납품용

deploy
개발용

libs
라이브러리 등 두는 곳(ex. libs/js/jquery-1.11.3.min.js )

src
컴파일 전 데이터 등 두는 장소(ex. src/scss/style.scss )



작업 이름
설명

common:before공통 작업. 전용 작업의 첫 번째 실행
deploy개발 시 전용 작업
release납품시 전용 태스크
watch파일 모니터링 및 업데이트 시 배포 작업


원래 Grunt판으로 만들었던 것을 앞으로 입문하려고 생각하고 Gulp판도 만들었습니다. Grunt와 달리 Gulp는 비동기 처리가 기본이므로 동기적인 처리를 하기 위해 run-sequence이라는 플러그인을 도입했습니다. 병렬 처리와 직렬 처리를 쉽게 구분하여 편리할 것 같습니다. 그 외 Gulp에 대해 여러가지 공부하고 자세한 것은 Gulp 참고를 봐 주세요.

템플릿 생성



Gulp판【 gulp-basic-nw 】


  • npm i yo -g (아직 설치하지 않은 경우)
  • npm i generator-gulp-basic-nw -g (아직 설치하지 않은 경우)
  • 생성하려는 디렉토리로 이동
  • yo gulp-basic-nw

  • Grunt판【 grunt-basic-nw 】


  • npm i yo -g (아직 설치하지 않은 경우)
  • npm i generator-grunt-basic-nw -g (아직 설치하지 않은 경우)
  • 생성하려는 디렉토리로 이동
  • yo grunt-basic-nw

  • Gulp 참고



    파일 삭제에 gulp 플러그인을 사용하지 않음
    ぃ tp // m / 신 / ms / bd7, d79526, f37, bd0

    작업 러너 gulp.js 가장 빠른 입문
    htp : // bg. 아나와. jp/엔트리/20140420/1397995711

    gulp에서 디렉토리 구조를 유지하는 복사본
    htp // 아카베코. 메/bぉg/2015/01/구 lp코 py-에에 pぢrst c c레스트/

    gulp 입문 그 3-고마고마 편리한 일
    h tp // c 그리고 r. 아인 c. 이. jp/아 r ゔぇ s/6994

    좋은 웹페이지 즐겨찾기