npm은 Node Packaged Manager의 약자로 node.js로 만들어진 모듈을 웹에서 받아 사용한다.
여기서 node.js는 자바스크립트를 브라우저 밖에서도 사용할수 있게하는 플랫폼이다. 자바스크립트는 브라우저 안에서만 사용하는하지만 node.js를 설치하면 브라우저 밖에서도 서버를 구축하는 등의 코드를 실행할 수 있다.
npm은 이름처럼 모듈을 관리하며 모듈을 활용해서 작업을 했다면 그 모듈에대한 버전도 업데이트를 확인하여 알려준다. node.js를 설치하면 npm이 같이 설치된다.
npm install
node.js에서 사용하는 모듈들을 패키지로 만들어 npm을 통하여 관리하고 배포하고 있다. 즉, 다른사람들이 만든 모듈들을 npm을 통해 사용가능하면 npm install
명령어를 사용해 한번에 설치해준다.
npm init
npm init
명령을 이용하여 애플리케이션에 대한 package.json 파일을 작성하며 그 값은 defaul로 저장된다. 명령어를 또 실행하면 default로된 옵션을 사용한다.
{
"name": "class200ok",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.11.10",
"@testing-library/react": "^11.2.5",
"@testing-library/user-event": "^12.8.3",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-icons": "^4.2.0",
"react-icons-kit": "^1.3.1",
"react-router-dom": "^5.2.0",
"node-sass": "^4.14.1",
"react-scripts": "4.0.3",
"styled-components": "^5.2.1",
"styled-reset": "^4.3.4",
"web-vitals": "^1.1.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"eslint-config-prettier": "^8.1.0",
"eslint-plugin-prettier": "^3.3.1",
"prettier": "^2.2.1"
}
}
1. description
설치한 모듈의 설명을 지정합니다. (npm search 사용 시 도움이 됩니다.)
위 package.json
경우 react관련된 모듈을 다운받았기에 그에대한 정보가 저장돼있는걸 확인할 수 있다.
2. script
패키지 라이프 사이클에서 여러 번 실행되는 스크립트 명령을 포함한다.
예로, 위에 코드에선 npm start
는 리액트를 시작하는 의미를 갖고있다.
3. devDependencies
패키지의 개발 시 사용될 의존성 모듈을 지정한다. (배포 시 포함되지 않는다)
eslint
와 prettier
의 정보를 포함한다.