npm 모듈을 이용해보자

underscore 모듈을 예시로 이용해보자. 

 

환경은 다음과 같습니다. 

Windows10

Node.js 12.16.1 LTS 

VScode

---

 

다른 사람이 만든 모듈을 사용하려고 한다. 

 

https://www.npmjs.com/package/underscore

underscore

 

 

 

1. 나의 패키지 초기화 

 

나의 프로젝트 디렉토리 자체도 일종의 '패키지' 이므로, (하나의 프로그램)

npm의 패키지로 지정을 해야 한다. 

npm 상에서 현재 디렉토리를 패키지로 지정하는 명령어를 실행해야 한다. 초기화. 

(나의 프로젝트 디렉토리 자체 를 이제 '나의 패키지'라고 한다.)

 

프로젝트 디렉토리에서 cmd를 켜고 npm init 을 입력한다. 

npm init

 

여러가지를 입력하라고 한다. 

대부분 Enter로 스킵해도 되지만, description은 입력해주는 것이 나중에도 편하다. 

 

entry point 나의 패키지가 시작하는 지점

git repository 깃에 올라갈 때의 깃 레포지토리 경로 (나중에 npm 홈페이지에 올릴때 이것을 써준다.)

 

끝나고 디렉토리를 확인해보면, 방금 입력한 내용들이 담긴 package.json 이 생성되어 있다. 

 

 

2. 패키지 설치

 

사용하려는 패키지 underscore 의 홈페이지를 방문해보자.

 

https://underscorejs.org/

Underscore.js

 

홈페이지에 써있는 설치 명령대로 cmd를 열고 프로젝트 디렉토리의 경로에서 설치해보자.  

npm으로 설치

프로젝트 디렉토리를 확인해보면, 설치한 underscore 디렉토리를 확인할 수 있다. 

 

3. [중요] 패키지 의존성 확인

 

프로젝트 디렉토리에 있는 package.json을 다시 보자. 

(underscore 디렉토리 내의 package.json이 아니다.)

 

"dependencies" 아래의 내용은 무슨 의미일까?

나의 프로젝트가 underscore 모듈의 버전 1.9.2를 쓰겠다는 것을 명시하는 것이다.

 

의존성을 명시하는 것! underscore 모듈 쓸때는 꼭 이 버전 쓰겠다는 뜻이다. 

 

 

혹시 "dependencies" 가 없다면,

npm 으로 모듈 설치를 할 때 다음과 같이 --save 옵션을 붙여서 다시 설치하면 된다.

--save 옵션 붙인 설치 명령어

 

 

 

4. 모듈 사용해보기 

 

underscore는 자바스크립트가 제공하지 않는 배열 관련 기능들을 많이 제공한다. 

underscore 홈페이지에서 Arrays 관련 함수를 살펴보자.

 

 

배열에서 인덱스 0을 지정하면 첫번째 요소에 접근한다. 

underscore의 함수로 배열의 요소에 접근해보자.

 

underscore.js 파일을 만들고,  underscore의 객체는 _ 로 이름지었다. 

 

파일을 실행해봤다. 

arr[0]은 _.first(arr) 와 같다. 

직관적인 함수 이름으로 배열 요소에 접근할 수 있는 것이다. 

마지막 요소는 last() 함수를 쓰면 된다. 

 

배열 인덱스로 접근한 것과 _를 이용한 결과가 똑같음을 확인했다. 

 

 

 

5. 더 알아보기 

 

npm  관련 설명이 친절하게 포스팅 되어 있다. 

 

https://poiemaweb.com/nodejs-npm

Node.js & npm | PoiemaWeb

node.js 개발 시에 npm 활용 비중이 크므로 꾸준히 공부하면서 숙달하도록 하자.