3. Gulp.js 소개와 설치-3

Gulp.js 설치 방법

Gulp.js는 Node.js 환경에서 실행되므로 먼저 Node.js를 설치해야 합니다. Node.js가 설치되어 있다면 다음 단계로 넘어갈 수 있습니다.

 

1. 새로운 프로젝트 디렉토리 생성

Gulp.js를 사용할 프로젝트 디렉토리를 생성합니다.

$ mkdir my-project
$ cd my-project

 

2. package.json 파일 생성

Node.js 프로젝트에서는 package.json 파일에 프로젝트에 필요한 모듈들과 버전 정보 등을 기록합니다. 다음 명령어를 입력하여 package.json 파일을 생성합니다.

$ npm init -y

-y 옵션은 모든 값을 기본값으로 설정하는 옵션입니다.

 

3. Gulp.js 전역 설치

Gulp.js를 전역으로 설치합니다. 이를 통해 gulp 명령어를 사용할 수 있게 됩니다.

$ npm install -g gulp

sudo 명령어가 필요한 경우가 있습니다. 이 경우 다음과 같이 입력하세요.

$ sudo npm install -g gulp

 

4. 프로젝트 로컬에 Gulp.js 설치

이제 프로젝트 디렉토리에서 Gulp.js를 설치합니다.

$ npm install gulp --save-dev

--save-dev 옵션은 package.json 파일에 Gulp.js 모듈 정보를 추가합니다.

 

5. Gulp.js 실행

이제 Gulp.js를 실행할 준비가 되었습니다. 다음 명령어를 입력하여 Gulp.js를 실행합니다.

$ gulp

이 명령어를 입력하면 gulpfile.js 파일에서 정의한 기본 task가 실행됩니다.

---

npm install 옵션 --save, --save-dev 의 차이

npm install 명령어를 사용할 때 --save 옵션과 --save-dev 옵션은 패키지를 설치하는 위치와 해당 패키지의 의존성(dependency)을 저장하는 위치가 다릅니다.

--save 옵션을 사용하면 패키지를 프로젝트의 종속성(dependency)으로 저장합니다. 이것은 애플리케이션을 실행하는 데 필요한 패키지로, npm install 명령어를 사용하면 자동으로 설치됩니다. 이것은 보통 프로덕션 코드에서 필요한 패키지들입니다.

예를 들어, 다음과 같은 명령어를 실행하면 lodash 패키지를 프로젝트의 종속성으로 설치합니다.

npm install --save lodash

--save-dev 옵션을 사용하면 패키지를 개발 의존성(devDependency)으로 저장합니다. 이것은 개발 중에만 필요한 패키지로, npm install 명령어를 사용하면 설치되지만 프로덕션 코드에서는 사용되지 않습니다. 이것은 주로 개발 시에만 필요한 도구나 테스트 프레임워크 등이 포함됩니다.

예를 들어, 다음과 같은 명령어를 실행하면 Jest 패키지를 프로젝트의 개발 의존성으로 설치합니다.

npm install --save-dev jest

만약 두 옵션을 모두 사용하지 않은 상태로 npm install 명령어를 실행한다면, package.json 파일의 dependencies와 devDependencies 필드에 아무런 패키지도 저장되지 않습니다. 이 경우 프로젝트에서 사용하려는 패키지를 모두 다시 설치해야합니다. 따라서, 패키지를 설치할 때는 보통 --save 또는 --save-dev 옵션 중 하나를 사용하여 패키지를 종속성 또는 개발 의존성으로 지정합니다.