gulp : The streaming build system.
gulp는 자바스크립트 프로젝트의 빌드를 편하게 하기 위한 도구입니다. (꼭 자바스크립트로 한정지어서 쓸 필요는 없어 보입니다.)
자바스크립트 프로젝트를 진행할 때 코드를 압축한다던지 각 문서에 코멘트를 넣는다던지, 테스트용 서버를 돌린다던지 할 때 유용한 도구죠.
플러그인을 잘 활용하면 커피스크립트 컴파일이라던지, 이미지 압축 등도 손쉽게 진행할 수 있습니다.
활용만 잘 하면 정말 유용한 도구가 될 거라고 생각합니다.
비슷한 툴로는 grunt 가 있는데, 이건 안써봤네요.
일단 gulp 를 이용하려면 Node.js 와 npm이 설치되어 있어야 합니다. [Node.js 설치 관련]
Node.js 를 사용할 수 있는 상태가 되어 있다면 gulp 를 설치해 줍니다.
$ npm install --global gulp-cli
위 명령어는 global 로 설치를 해주는 거라서 한번만 진행해 주면 됩니다.
이제부터 아래에 나오는 내용은 매 프로젝트마다 별개로 진행해 주어야 하는 내용입니다.
우선 프로젝트 디렉토리를 만들고 해당 디렉토리로 이동합니다.
$ npm init
위 명령어로 package.json 파일을 생성해 줍니다.
$ npm install --save-dev gulp
그리고 위 명령어로 gulp를 프로젝트 종속적으로 설치해 줍니다.
프로젝트 디렉터리 내에 node_modules 라는 디렉토리가 생기면서 그 안에 설치가 됩니다.
그리고 gulpfile.js 파일을 생성해 줍니다.
[gulpfile.js]
var gulp = require('gulp');
gulp.task('default', function() {
console.log('gulp Run');
});
위 파일은 gulp 를 실행하면 수행할 내용입니다.
여기에 각종 플러그인을 이용해서 압축, 파일 복사 등 하시고 싶은 작업을 수행하면 되는 것이죠!
실행은 아래와 같이 수행하면 됩니다.
$ gulp
혹은
$ gulp [작업이름]
위와 같이 수행하시면 됩니다.
마지막으로! 플러그인 추가는 어떻게 하는가 하면!
gulp 를 설치한 것과 똑같이 설치해 주시면 됩니다.
$ npm install --save-dev [plugin name]
대부분 gulp 를 지원하는 플러그인의 이름은 gulp-플러그인 이름 과 같은 형태로 되어 있습니다.
