[gulp] gulp 시작하기

퍼블리셔로 일을 하다보면 마크업이 전부가 아니게 된다.

이것 저것 신경써야 할게 많고, 내 머리에서 나오는게 충분하지 않기 때문에 다양한 사이트의 힘을 빌려야 할때가 많다.

그럼 매번 작업을 하고 수정을 할때마다 똑같은 작업을 반복(예를 들어 css minify나 scss를 css로 변환하던가 하는..)해야 하는 이 번거로움을 어떻게 줄일 수 있을까? 

 

gulp를 사용해서 초기에 셋팅을 해놓으면 알아서 변환이 된다. 

나도 사용안해봐서 이게 얼마나 편하고 좋은지는 모르겠다. 이제 써봐야지 싶어서(반강제적으로) gulp를 사용하기로 했다.

 

 

우선gulp를 작업 환경을 구축해야한다.

 

 

1. 

Node.js 다운받기

10.16.0 LTS를 다운받는다.

 

나는 react 때문에 미리 다운받았기 때문에 패스~

 

 

2.

git for windows 다운받기

node 생성할 때 사용한다.

 

이 역시 이미 설치되어 있기 때문에 패스~

 

 

3.

로컬에 gulp를 사용할 폴더를 만든다.

폴더이름은 gulp말고 다른 이름으로..

 

 

4. 

폴더를 열어 폴더 내에서 마우스 오른쪽 버튼을 눌러 git bash를 실행한다.

 

 

$ npm install gulp -g

=> gulp를 전역적으로 설치한다. 최초 1회만 하면 된다.

 

$ npm install gulp --save-dev

=> 해당 폴더에서 gulp를 로컬 설치한다.

 

$ gulp -v

=> gulp가 잘 설치되었는지 버전 확인한다.

 

 

$ npm init

=> package.json 생성 배포할 때 반드시 필요한 파일이다.

별다른 값이 없으면 계속 엔터친다. 그러면 생성된다.

 

 

 

5.

만들어 놓은 gulpfile.js 파일을 폴더에 넣고, npm install도 한다.

gulpfile안에는 내가 사용할 task들을 넣으면 된다. 참고로 gulp 4버전 부터는 function으로 묶어서 사용해야 한다.

 

 

 

 

 

참고 : https://webclub.tistory.com/467