[React] React를 위한 npm 설치 및 사용법

NPM (node package manager)

nodejs로 만들어진 앱들의 앱스토어
npm을 이용하여 프로그램을 검색, 설치, 업데이트, 삭제할 수 있다.

 

 

---

npm 설치

nodejs를 설치하면 npm이 함께 설치 된다.

nodejs.org에서 최신 버전으로 설치한다.

 

Node.js

 

npm 실행

1. window+R을 누르면 실행 창이 뜬다.

2. <실행>창에 cmd 입력

 

console창에 node -v를 입력하고 엔터를 쳤을 때 버전이 표시되면 nodejs가 잘 설치 된 것이다.

 

C:\Users\eunji>node -v
v15.5.1

console창에 npm -v를 입력하고 엔터 쳤을 때도 버전이 표시되면 npm도 잘 설치 된 것이다.

 

C:\Users\eunji>npm -v
v15.5.1

console창에 npm를 입력하고 엔터를 치면 npm설명서가 나온다.

 

C:\Users\eunji>npm

Usage: npm <command>

npm install        install all the dependencies in your project
npm install <foo>  add the <foo> dependency to your project
npm test           run this project's tests
npm run <foo>      run the script named <foo>
npm <command> -h   quick help on <command>
npm -l             display usage info for all commands
npm help <term>    search for help on <term>
npm help npm       more involved overview

All commands:

    access, adduser, audit, bin, bugs, cache, ci, completion,
    config, dedupe, deprecate, dist-tag, docs, doctor, edit,
    exec, explain, explore, find-dupes, fund, get, help, hook,
    init, install, install-ci-test, install-test, link, ll,
    login, logout, ls, org, outdated, owner, pack, ping, prefix,
    profile, prune, publish, rebuild, repo, restart, root,
    run-script, search, set, set-script, shrinkwrap, star,
    stars, start, stop, team, test, token, uninstall, unpublish,
    unstar, update, version, view, whoami

Specify configs in the ini-formatted file:
    C:\Users\eunji\.npmrc
or on the command line via: npm <command> --key=value

More configuration info: npm help config
Configuration fields: npm help 7 config

npm@7.3.0 C:\Program Files\nodejs\node_modules\npm

npm 사용

www.npmjs.com 에서 원하는 모듈을 검색한다.

 

npm | build amazing things

npm에서 모듈을 설치할 때는 npm install [모듈명]을 입력한다.

 

npm install [모듈명]

이때 현재 디렉토리에서만이 아니라 컴퓨터 어디에서 실행시키건 동작하는

전역적인 모듈로 설치를 하고자 할 때는 -g(global 약자)를 추가한다.

 

npm -g install [모듈명]

npm 사용 시 권한 오류가 발생할 경우 sudo 명령어를 통해 소유권을 변경한다.

 

sudo npm -g install [모듈명]

npm 설치된 모듈 목록 보기

npm list -g 를 입력하면 현재 전역적으로 설치되어 있는 모듈의 하위 항목까지 모두 보여준다.

 

npm list -g

전역적으로 설치되어 있는 상위 모듈만을 보고 싶다면 --depth=0를 입력한다.

 

npm list -g --depth=0

npm 업데이트

npm update -g [모듈명]

npm 삭제

npm uninstall -g [모듈명]

React 설치 공식 문서 권장 방식

npm이 모듈을 설치하는 것이라면 npx는 임시로 한번 설치하고, 한번만 실행시키고 지우는 것이다. 
장점은 컴퓨터의 공간을 낭비하지 않고,  
사용할 때 마다 새로 다운로드 받기 때문에 항상 최신 버전을 사용할 수 있다.

 

npx create-react-app