홈페이지>웹 디자인 튜토리얼>자바스크립트 튜토리얼

두 가지 강력한 Node 패키지 관리자인 npm 및 Yarn을 알아보세요.

저자：Eve Cole 업데이트 시간：2023-04-04 10:39:22

이 기사에서는 Node.js의 두 가지 강력한 패키지 관리자인 npm과 Yarn에 대해 설명하겠습니다. 도움이 되기를 바랍니다.


6306e547ba2a5383.jpg


Node.js 빠른 소개 과정: 배우려면 입력하세요.

Node 배우는 첫 번째 단계는 노드의 패키지 관리자 인 npm 을 이해하는 것입니다. 우리는 일부 패키지 리소스를 다운로드하는 데 자주 사용하기 때문에 모든 사람이 npm 에 익숙하다고 생각합니다.

하지만 npm 의 리소스 라이브러리(https://www.npmjs.com/)가 해외에 있기 때문에 이를 이용한 리소스 다운로드 속도가 상대적으로 느리기 때문에 yarn , 국내 등 타사 node包管理器npm 과 동기화합니다. 창고 업데이트 Taobao 미러(cnpm)

다음으로 우리는 이러한 내용을 깊이있게 배울 것입니다. 시작합시다!

Node 시리즈 칼럼이 업데이트되기 시작했습니다. 블로거를 팔로우하고, 칼럼을 구독하고, 헤매지 않고 Node를 배워보세요!

1. npm 사용

npm이 무엇인가요?

npm 사용하기 전에 먼저 npm 이 무엇인지 이해해야 합니다. Node 시리즈 칼럼의 첫 번째 기사인 [Node.js | 프론트 엔드에서 풀 스택으로 가는 유일한 방법]에서는 npm 이 Node 의 오픈 소스 창고라고 언급되어 있습니다. 세계에서 가장 큰 오픈 소스 창고입니다.

이 창고의 주소는 https://www.npmjs.com/입니다.

2020년 3월 17일 현재 npm 약 1,200만 명의 개발자에게 130만 개의 패키지를 제공했으며, 개발자는 매달 750억 번 다운로드했습니다.

npm 웨어하우스의 리소스를 다운로드하고 사용하려면 npm的指令( npm i axios download axios 와 같이 npm 으로 시작)을 사용하거나 Yarn 등과 같은 다른 타사 지침(타사 Node包管理器)을 사용할 수 있습니다. .

공식 성명: npm NodeJS 용 패키지 관리 및 배포 도구입니다.

패키지 관리는 다양한 NodeJS 소프트웨어 패키지를 저장하고 관리하는 NodeJS 웨어하우스라는 점에 반영됩니다.

배포 도구는 npm的指令사용하여 npm 창고에서 패키지를 다운로드하는 방식으로 구현됩니다.

NodeJS 환경을 구성하면 npm指令模块NodeJS 와 함께 설치됩니다. 터미널을 통해 npm -v 실행하면 설치된 버전을 볼 수 있습니다.


여기에 이미지 설명을 삽입하세요.


그러나 기본 설치된 npm 버전이 너무 오래된 경우 npm을 직접 수동으로 설치하고 업데이트할 수도 있습니다.

 npm i npm@latest -g

@latest 최신 버전 설치를 나타내고, -g 전역 설치를 나타냅니다. 이러한 npm 지침은 나중에 설명합니다.

위에서는 마법 같은 것을 찾을 수 있습니다. npm 통해 npm 설치하고 있습니다. 직접 설치할 수 있나요?

이는 실제로 이해하기 쉽습니다. npm的指令模块도 npm Warehouse에 패키지로 저장되어 있으며, 이 패키지의 이름은 npm 주소 npm 참조하세요.

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


여기에 이미지 설명을 삽입하세요.


따라서 우리가 일반적으로 npm이라고 부르는 것은 npm의 명령 모듈(npm이라는 패키지)을 나타냅니다.

하지만 실제로 npm 이라는 단어는 npm指令模块을 의미하고 NodeJS 오픈 소스 웨어하우스 자체인 npm 나타내기도 하므로 npm 에서 npm 다운로드합니다(이 npm은 NodeJS의 오픈 소스 웨어하우스를 나타냅니다)(이 npm은 오픈 소스 웨어하우스를 나타냅니다). npm이라는 소스 웨어하우스 이 패키지, 이 패키지는 npm의 명령 모듈입니다)

npm 일반 명령

많은 npm 지침이 있습니다. 여기서는 일반적으로 사용되는 지침만 나열합니다. 자세한 내용은 npm 공식 문서를 참조하세요.

  • 여기에 이미지 설명을 삽입하세요. npm init : package.json 생성



  • npm install : package.json 에 기록된 모든 리소스를 다운로드합니다 .

  • npm install 包名: 지정된 패키지를 현재 디렉터리에 다운로드합니다 .

  • npm uninstall 包名: 현재 디렉터리에서 지정된 패키지를 제거합니다.

  • npm update 包名: 현재 디렉터리에서 지정된 패키지를 업데이트합니다 . 패키지 이름이 추가되지 않으면 현재 디렉터리의 모든 패키지가 업데이트됩니다.

  • npm outdated 包名: 현재 디렉터리에 지정된 패키지가 오래되었는지 확인합니다 . 패키지 이름이 추가되지 않으면 현재 디렉터리의 모든 패키지를 확인합니다.

  • npm info 包名: 현재 디렉터리에 있는 패키지에 대한 자세한 정보를 가져옵니다 .

  • npm list : 현재 디렉터리에 설치된 모든 패키지와 해당 종속성을 보고 버전 번호를 표시합니다 ( list ls 로 축약할 수 있음).

  • npm list 包名: 현재 디렉터리에 설치된 특정 패키지의 버전 번호 보기 ( list ls 로 축약 가능)

몇 가지 추가 사항:

  1. install i 로 축약될 수 있습니다. 예: npm install axios npm i axios 로 축약될 수 있습니다.

  2. uninstall un 으로 축약될 수 있습니다.

  3. 패키지 이름 뒤에 @ 기호를 추가하여 패키지 버전을 지정합니다. 예: npm i md5@1 md5 버전 1을 다운로드하고, npm i md5@latest 는 최신 버전의 md5를 다운로드한다는 의미입니다.

npm 명령 접미사

  • -g : 글로벌 환경 지정

    npm 명령은 기본적으로 현재 디렉터리에서 작동합니다. -g 추가하면 전역 환경 에서 작동하도록 지정됩니다. 위에서 언급한 것처럼 npm i npm@latest -g 사용하여 모든 디렉터리에서 npm을 사용할 수 있습니다. .

  • --save -s 로 축약될 수 있습니다 . 프로덕션 환경 에서 종속성을 지정합니다( dependencies 에 기록됨).

    npm5 버전 이후 기본값은 --save 입니다. 예를 들어 axios는 프로덕션 환경과 개발 환경 모두에 설치되어야 합니다: npm i axios -s

  • --save-dev -D 로 축약될 수 있습니다 . 개발 환경 에서 종속성을 지정합니다( devDependencies 에 기록됨).

    프로덕션 환경에 필요하지 않은 babel을 설치하려면 (개발 환경에서만 사용됨): npm i babel -D

  • --save-prod -P 로 축약될 수 있습니다 . --save 와 동일합니다.

  • --save-optional -O 로 축약될 수 있습니다 . 선택적 종속성을 지정합니다( optionalDependencies 에 기록됨).

  • --no-save : package.json 에 기록되지 않습니다.

-g，--save，--save-dev 의 특정 기능과 차이점에 대해서는 내 기사인 npm install -g/–save/–save-dev의 차이점을 참조하세요.

npm 명령 접미사를 패키지 이름 앞에 배치할 수도 있습니다: npm i -g npm@latest

종속성 패키지 관리

npm 에서 잘 알려진 종속성은 dependencies 과 devDependencies 입니다.

또한 실제로 다음이 포함됩니다.

  • peerDependencies ,

  • optionalDependencies

  • bundledDependencies / bundleDependencies

이를 포함한 여러 종속성이 package.json 에 기록됩니다.


여기에 이미지 설명을 삽입하세요.


위에서 npm 명령 접미사 에 관해 이야기할 때 이러한 종속성을 언급했습니다. 다음은 이것이 나타내는 내용에 대한 자세한 설명입니다.

dependencies 및 devDependencies

내 다른 기사를 확인하세요: npm install -g/–save/–save-dev의 차이점

peerDependencies

한 기사에서 PeerDependency 이해하기라는 기사를 확인할 수 있습니다.

optionalDependencies

선택적 종속성. 설치가 실패하더라도 계속 실행할 수 있는 종속 패키지가 있거나 npm을 계속 실행하려는 경우, optionalDependencies optionalDependencies 사용하면 dependencies 에서 동일한 이름으로 종속성을 덮어쓰게 됩니다. 두 곳에 모두 적어주세요.

bundledDependencies / bundleDependencies

패키징 종속성인 bundledDependencies 는 종속 패키지 이름 dependencies 포함하는 배열 개체입니다. 게시 시 이 devDependencies 의 패키지는 최종 릴리스 패키지로 패키징됩니다. 오류.

package.json에서 주의가 필요한 패키지 버전 문제

npm 통해 다운로드한 모든 패키지의 버전 정보는 package.json 에 기록됩니다.

npm i 실행하면 package.json 에 기록된 패키지 정보를 기반으로 다운로드됩니다. 다운로드 규칙은 다음과 같습니다.

  • 패키지 버전이 ^ (기본값)으로 시작하면 대형 버전이 잠깁니다.

     //패키지.json
"종속성": {
"md5": "^2.1.0" // } ^로 시작,

    npm i 통해 최신 버전의 md5 2.xx (두 주요 버전 아래의 최신 버전)가 설치됩니다. 이는 반드시 2.1.0일 필요는 없지만 2.3.0일 수도 있습니다.

  • 패키지 버전이 ~ 로 시작하면 두 번째 주요 버전으로 잠깁니다.

     //패키지.json
"종속성": {
"md5": "~2.1.0"
},

    npm i 통해 최신 버전의 md5 2.1.x (버전 2.1 이하의 최신 버전)를 설치합니다. 이는 반드시 2.1.0일 필요는 없지만 2.1.1일 수도 있습니다.

  • 패키지 버전은 * 이며 최신 버전으로 잠깁니다.

     //패키지.json
"종속성": {
"md5": "*"
},

    npm i 통해 최신 버전의 md5 설치하겠습니다.

  • 패키지 버전 앞에 접두사가 없으면 지정된 버전으로 잠깁니다.

     //패키지.json
"종속성": {
"md5": "2.1.0"
},

    npm i 통해 md5 버전 2.1.0을 설치합니다.

느린 npm 속도 문제 해결

npm 창고가 해외에 있기 때문에 중국에서 npm 명령을 사용하여 이 외국 창고의 콘텐츠를 다운로드하는 속도가 느려집니다.

이때 다음 명령을 실행하여 npm Warehouse 소스를 국내 Taobao 이미지(cnpm) 소스로 전환할 수 있습니다.

 npm 구성 세트 레지스트리 https://registry.npmmirror.com

현재 소스를 보려면 npm config get registry 사용하세요.

여기에 이미지 설명을 삽입하세요.


앞으로 npm 사용하게 되면 국내 타오바오 미러웨어하우스에서 자동으로 다운로드가 되는데, 속도가 매우 빨라질 것입니다.

타오바오 미러의 이전 소스 주소는 http://registry.npm.taobao.org였지만 현재는 http://registry.npmmirror.com으로 변경되었습니다.

그러나 npm 구성을 수정하여 소스를 전환하는 것은 필연적으로 약간 번거로울 수 있습니다. npm 소스를 빠르게 전환하는 데 도움이 되도록 nrm 전역적으로 설치할 수 있습니다.

nrm을 사용하여 npm 소스를 빠르게 전환하세요.

nrm을 전역적으로 설치합니다 .

 npm 설치 -g nrm

nrm ls 실행하여 전환 가능한 npm 소스를 확인하세요 .


여기에 이미지 설명을 삽입하세요.


npm use 사용하여 Taobao 소스로 전환 하는 등 소스 전환: nrm use taobao


여기에 이미지 설명을 삽입하세요.


nrm test 源名사용하여 해당 소스의 응답 시간을 테스트합니다.


여기에 이미지 설명을 삽입하세요.


Taobao 소스의 응답 속도가 npm 의 기본 소스보다 훨씬 빠른 것을 확인할 수 있습니다.

중국어 npm 미러: cnpm

cnpm 공식 버전 대신 사용할 수 있는 완전한 npmjs.org 미러입니다.

cnpm 과 공식 버전 간의 동기화 빈도는 10분에 한 번입니다. cnpm 공식 홈페이지

cnpm 다운로드:

 npm install -g cnpm --registry=https://registry.npmmirror.com

cnpm은 Taobao 미러 소스입니다 . 위의 Taobao 미러 소스를 사용할 때 npm 소스를 Taobao 미러 소스( cnpm )로 변경한 다음(이 소스는 실제로 창고 주소를 나타냄)를 통해 사용합니다. npm 명령.

cnpm 의 전체 이미지를 직접 다운로드 한 다음 npm 명령 대신 cnpm 명령을 사용할 수 있습니다.

 cnpm installcnpm i axios -g

// ....

cnpm 의 지침은 npm 의 지침과 완전히 동일합니다. 사용 시 npm 대신 cnpm을 사용하세요 .

2. 원사의 사용

Yarn은 Facebook에서 출시한 npm 보다 빠르고 효율적인 종속성 관리 도구입니다.

설치하다:

 npm 설치 -g 원사

원사 업데이트:

 원사 세트 버전 최신
소스의 원사 세트 버전

이점

  • 엄청 빠르다
    yarn 다운로드한 각 패키지를 캐시하므로 다시 사용할 때 다시 다운로드할 필요가 없습니다. 또한 병렬 다운로드를 활용하여 리소스 활용도를 극대화하므로 설치 속도가 빨라집니다.

  • 매우 안전함 <br/> 코드를 실행하기 전에 yarn 알고리즘을 통해 각 설치 패키지의 무결성을 확인합니다.

실 공통 지침


여기에 이미지 설명을 삽입하세요.

  • yarn init : 프로젝트를 초기화하고 package.json 파일을 생성합니다. 생성 단계는 npm init

  • yarn help : 명령 목록 표시

  • yarn install : package.json 에 기록된 모든 리소스를 다운로드합니다 yarn

  • yarn add 包名: 지정된 패키지를 현재 디렉터리에 다운로드합니다 .

  • yarn remove 包名: 현재 디렉터리에서 지정된 패키지를 제거합니다.

  • yarn upgrade 包名: 현재 디렉터리에서 지정된 패키지를 업데이트합니다 . 패키지 이름 뒤에 @指定版本号추가하여 업데이트해야 하는 버전을 지정할 수 있습니다.

yarn 명령 접미사

  • --dev : 개발 환경 ( devDependencies )에서 종속성을 지정하며 -D 로 축약됩니다.

  • --peer : 핵심 종속성을 지정합니다( peerDependencies ).

  • --optional : 선택적 종속성을 지정합니다( optionalDependencies ).

결론

이번 글에서는 npm 과 yarn 뿐만 아니라 npm에서 파생된 nrm , cnpm 등을 소개합니다.

블로거들은 소스 전환을 위해 npm + nrm 조합을 사용해 왔습니다. 이는 빠른 속도를 보장할 뿐만 아니라 cnpm 및 yarn

npm 과 yarn 모두 많은 내용을 담고 있습니다. 이 글에서는 가장 일반적으로 사용되는 내용만 설명합니다. 더 알고 싶으시면 해당 공식 웹사이트를 방문하시면 됩니다.

관련 기사