js > Gulp

시작하기

gulp.js 설치와 시작하기

gulp를 시작하기 위해서는 우선 node.js 가 설치되어 있어야 한다.

컴퓨터의 커맨드창에 node --version 이라는 명령어를 입력했을때 아래와 같이 나오면 정상적으로 설치가 되어 있는 것이다.

node --version
npm --version
npx --version

node-설치확인

내 컴퓨터에는 노드 v13.7.0 이 이미 설치되어 있다. 만약 노드가 설치되어 있지 않다면 노드를 설치하기 바란다.
 

gulp 커맨드라인으로 설치하기

노드가 설치되어 있으면 npm과 npx 자동으로 설치가 된다. 아래 명령어는 gulp 를 컴퓨터의 모든 곳에서 사용하겠다는 것이다. 내 컴퓨터 어느 폴더에서나  gulp를 실행할 수 있게 해준다. 

> npm install --global gulp-cli

프로젝트 폴더를 만들고 폴더안으로 들어가기

gulp 공식 가이드 문서를 보면 npx 를 사용하여 프로젝트 폴더를 만든다. 아마도 노드가 설치되어 있으면 여러 운영체제에서 동일한 명령어로 실행하기 위해서 그런 것 같다. 여기서 npx 가 나오는데 npx는 한번만 사용할 작업을 할때 사용한다고 간편하게 생각하면 좋을 것 같다. 폴더는 한번만 생성하기 때문에 npx mkdirp 명령어를 사용했다. 프로젝트 폴더가 생성되면 cd 명령어를 통해 프로젝트 폴더로 들어간다.

npx mkdirp my-project
cd my-project

create project folder

프로젝트 폴더안에 package.json 파일 생성

npm init 명령어를 실행시키면 프로젝트 이름, 버전, 라이선스등 프로젝트의 관련 정보를 package.json 파일안에 기입할수 있는 창이 나타나고 프로젝트에 대한 정보를 입력하면 된다.

npm init

npm init

개발모드로 gulp 설치

아래 명령어대로 설치하면 프로젝트 폴더안에 걸프가 설치되고 package.json 파일에 설치한 패퀴지가 기록이 된다. 이렇게 하는 이유는 이 프로젝트를 다른 컴퓨터에서 실행하기 위해서 어떤 패퀴지가 사용되었는지 알아야 하기 때문에 --save-dev 옵션을 사용하여 gulp를 설치한다고 생각하면 된다.

npm install --save-dev gulp

gulp_install_dev

cat package.json 명령어를 이용해서 패퀴지파일 내용을 확인하면 "devDependencies" 안에 gulp:4.0.2 라고 기록되어 있는 것을 확인 할 수 있을 것이다.

gulp 버전확인

gulp --version 명령어를 사용하면 아래 그림처럼 버전을 확인할수 있을 것이다. 정상적으로 나온다면 gulp.js를 시작할 준비가 된 것 이다.

gulp --version

verify

 

https://gulpjs.com/docs/en/getting-started/quick-start

댓글

댓글 본문