하루에 한 문제

NPM 이란? 본문

Dev/JavaScript

NPM 이란?

dkwjdi 2021. 4. 16. 23:02

NPM은 (Node Package Manger)의 약자로 명령어로 자바스크립트 라이브러리를 설치하고 관리하는 패키지 매니저다.

개발자는 단 몇줄의 명령어료 기존의 공개된 모듈들을 설치하고 활용할 수 있다

Java랑 비교하자면 메이븐정도 되는 것 같다.

 

패키지란 ?

  • 라이브러리 - 코드의 작성을 위해 사용되는 코드의 묶음
    패키지 - 코드의 배포를 위해 사용되는 코드의 묶음
    컴파일한 소프트웨어의 바이너리, 환경설정(configuration) 관련정보, 의존(dependency)관련정보
  • 패키지는 라이브러리를 포함할 수도 있으며, 일반적으로 라이브러리와 실행파일을 포함한다.

 

의존성 관리

  • 프로젝트에서는 아주 많은 패키지를 사용하게 된다.
  • 이런 패키지들의 버전이 빈번하게 업데이트 되므로 프로젝트가 의존하고 있는 패키지들이 관리될 필요가 있다.
  • npm에서는 package.json 파일로 프로젝트의 정보와 패키지들의 의존성을 관리한다.

package.json

  • package.json 에는 사용하고 있는 패키지들의 명세가 작성되어 있기 때문에 프로젝트를 다른 사람에게 공유하고 싶다면 package.json을 공유해 개발 환경을 빠르게 구축할 수있다.
  • JAVA에서는 Maven의 pom.xml과 비슷한 역활을 한다고 생각하면 좋다.
{
	"name" : "test",
	"description" : "javascript's test programming.",
	"keywords" : ["util", "f", "server", "client", "browser"],
	"author" : "Goorm",
	"contributors" : [],
	"dependencies" : [],
	"repository" : {"type": "git", "url" : "git://gitbub.com/documentcloud/test.git" },
	"main" : "test.js",
	"version" : "1.1.6"
}
Key Value
name -프로젝트 이름으로, 가장 중요하다.
-중앙 저장소에 배포할 때 version과 함께 필수 항목이다.

-url로 사용되고, 설치할 때 디렉토리 이름이 되기 때문에 url이나
 디렉터리에서 쓸 수 없는 이름을 사용하면 안 된다.
-이름에 node나 js가 들어가면 안 됩니다.
-require() 함수의 인수로 사용되며 짧고 알기 쉬운 것으로 짓는 것이 좋다
version -프로젝트 버전을 정의한다.
-3단계 버전을 사용하며, - 로 태그 이름을 적을 수 있다
 (SemVer 버전 넘버링)

1.Major Version: 하위 호환이 안될 정도로 패키지의 내용이 수정되었을
                      때 올라가는 버전

2.Minor Version: 하위 호환이 가능한 기능 업데이트 시 올라가는 버전
3.patchs: 기존 기능에 문제가 있어 수정한 것을 내놓았을 때 올라가는 버전

description -프로젝트 설명으로, 문자열로 기술한다
-npm search로 검색된 리스트에 표시되기 때문에 사람들이 패키지를
 찾아내고 이해하는 데 도움이 된다.
keywords -프로젝트를 검색할 때 참조되는 키워드이다.
-description과 마찬가지로 npm search로 검색된 리스트에 표시한다.
homepage -프로젝트 홈페이지 주소다
-url 항목과는 다르며, url을 설정하면 예상치 못한 움직임을 하게 되므로
 주의가 필요하다.
author -프로젝트 작성자 정보로, 한 사람만을 지정한다.
-JSON 형식으로 name, email, url 옵션을 포함한다.
contributors -프로젝트에 참여한 공헌자 정보로, 여러 사람을 배열로 지정할 수 있다.
repository -프로젝트의 소스 코드를 저장한 저장소의 정보이다.
-홈페이지 url을 명시해서는 안된다.
scripts -여러가지 NPM명령어에 대한 지정이다.
-scritps에 build라는 명령어를 만들었으면 npm run build명령 수행 시 해당
 명령어가 실행된다.
config -"config" 객체는 패키지의 버전에 관계없이 패키지 스크립트에서 사용될   수 있는 설정 정보이다. 
-<name>[@version>]:<key>의 설정 매개 변수가 있으면 환경에서         package.json의 "config"키를 덮어 쓴다.
-예를 들어 아래와 같은 패키지에 다음과 같은 값이 설정되어 있다면,
 "start" 명령을 실행할 때 npm_package_config_port를 참조 가능하다.

package.json

server.js

사용자가 다음을 수행해 동작을 변경할 수 있다.

dependecies

-프로젝트 의존성 관리를 위한 부분이다. 
-이 프로젝트가 어떤 확장 모듈을 요구하는지 정리 가능하다.
-일반적으로 package.json에서 가장 많은 정보가 입력되는 곳이다.
-애플리케이션을 설치할 때 이 내용을 참조하여 필요한 확장 모듈을 자동   으로 설치한다.
- npm install 명령은 여기에 포함된 모든 확장 모듈들을 설치하게 되어 있    다.

devDependencies -개발할 때만 의존하는 확장 모듈을 관리한다.
license -패키지 사용자들이 여러분이 만든 패키지를 사용하기 위해 어떠한 권한을   얻는지, 또는 어떤 금기사항이 있는지 알게하기 위해 라이센스를 명시한다.
-가장 간단한 방법은 BSD-3-Claues나 MIT 같은 일반적인 라이센스 표준인    SPDXID를 아래와 같이 지정하는 것이다.

 

NPM을 사용하면 얻는 장점

관리 용이

  • 라이브러리가 페이지 중간에 넣어도 돌아가는게 웹 개발의 유연함이지만 그에 따라 의존성, 라이브러리 버전 관리가 매우불편한다.
  • 라이브러리 사이간 버전 의존이 있어 버전 관리가 불편했으나 package.json안에서 dependencies 한곳에 다 뭉치게 되어 라이브러리 관리가 편해졌다.

설치용이

  • cdn을 사용할 때는 검색하고 찾아서 태그를 긁어와야 하는 번거로움이 잇다.
  • 내가 필요한 것이 있다면 npm install로 라이브러리 설치가 빠르게 된다.
  • 내 컴퓨터 환경에 node_modules에 잘 정돈되어 설치된다.

 

NPM 명령어

--save-dev (D)

  • 개발환경에서만 사용 ( package.json 안에 devDependencies에 기록)

--global (-g)

전역 설치

npm init

package.json을 만드는 명령어

npm install

package.json 파일 및 해당 종속성에 나열된 모든 모듈을 설치

npm update

설치된 패키지를 업데이트하는 명령어

npm start

package.json 의 scripts에 있는 start명령어를 실행하는 부분

만약 start 명령어를 따로 설정하지 않았다면 node server.js가 실행됨

npm run

script를 실행하는 명령어

만약 scripts에 build명령어가 있다면, npm run build 하면 된다.

 

 

 

NPM vs Yarn

  • Js의 대표적인 패키지매니저로 NPM(Node Package Manage)와 Yarn(Facebook이 개발한)가 있다.
  • NPM의 일관성, 보안, 빌드시 성능 등에 문제를 해결하기 위해 Facebook이 Yarn을 개발했다.

Performance

  • Yarn의 릴리즈 초기에는 Yarn의 성능이 뛰어났지만 현재는 성능부분의 차이는 거의 없다고 봐도 무방하다.

Security

  • NPM은 패키지들이 코드를 자동적으로 즉시 실행하는 것을 허용할 뿐만 아니라 의존성들도 즉시 자동적으로 실행된다.
  • 이 특징이 편리함을 제공하기도 하지만, 보안성에 대해 몇가지 염려를 만든다.(특히, 패키지 등록정책에서 심사가 필요없는 부분)
  • 이와 다르게 Yarn은 오직 yarn.lock 혹은 package.json로 부터 설치된다.
  • 구체적으로 말하자면 yarn.lock은 모든 장치들이 같은 패키지들을 설치하는 것을 보증해준다.
  • 그러므로 패키지의 차이로 부터 발생하는 버그의 확률을 현저하게 감소시킨다.

 

참고

programmingsummaries.tistory.com/385

edu.goorm.io/learn/lecture/557/%ED%95%9C-%EB%88%88%EC%97%90-%EB%81%9D%EB%82%B4%EB%8A%94-node-js/lesson/174371/package-json

itnovice1.blogspot.com/2019/01/js-npm.html

velog.io/@prayme/NPM%EC%9D%B4%EB%9E%80

'Dev > JavaScript' 카테고리의 다른 글

Promise  (0) 2021.04.19
async VS defer  (0) 2021.04.17
클로저  (0) 2021.04.15
스코프 체인  (2) 2021.04.14
실행 컨텍스트  (0) 2021.04.13
Comments