dependencies와 devDependencies차이

지두팔·2024년 5월 28일
post-thumbnail

지금껏 vscode를 사용해오며 패키지를 수도 없이 설치 해왔지만 -g, -D, 등 의미를 알 수 없으면서도
-아니 사실 종속성/ 글로벌 설치 등으로 써져 있어도 그게 뭔 뜻 인지 궁금해 하지도 않았음. 그저 복붙. -
설치를 위한 명령어라니 쓰라면 쓰라는대로 걍 써왔었다. 설치 잘 되니 넘어가고.
이제서야..이제서야~ 그 뜻에 대해 궁금증이 생겼다. 뭐가..다른건데..?

지역 설치

  • npm install _____ 걍 이런 지역 설치는 '해당 프로젝트'에만 설치가 됨.
  • npx로 호출해야만 실행이 가능함!

-g 글로벌 설치

  • 내 컴퓨터에 설치! 전 역 설 치
    • 근데 이렇게 설치 하면? package.json 에 안남는다...!
    • 이렇게 되면 협업할 때 내가 뭘 설치 했는지 안 남네! 협업을 위해서는 지역 설치가 권장되겠구나.

익스텐션 설치

  • vscode 내에 있는 익스텐션으로 설치 시, npm 설치와 동일하게 작동하지만 (ex. 라이브 서버 등) 이 또한 package.json 에 안남는다...! 글로벌 설치와 같은 맥락.

-D 설치

  • package.json에서 dependencies 에는 프로젝트 작업 중에 npm install 명령어를 통해서 설치한 라이브러리들이 들어가 있다.
  • 그런데 설치시 명령어에 -D 를 붙여서 설치한 패키지에는 package.json 에서 devDependencies 에 들어가 있네???

dependencies vs devDependencies

  • 애플리케이션 동작과는 직접적인 연관은 없지만,
    • devDependencies: 개발할 때 필요한 '개발용 라이브러리'가 표시
      • 클라이언트는 필요없어? 개발용으로만 필요해. 요건 배포할 때 포함 안돼.
      • eslint, prettier 등이 로컬 개발단계에서만 사용되는 대표적인 예
    • dependencies: 배포할 때 포함되는 배포용 라이브러리 표시.
      • 웹 화면에 영향을 끼치는 라이브러리, 패키지

🤔 근데 이거 왜 구분해? 그냥 그럴거면 다 일반으로 설치하면 안되나?
👉되긴 함. BUT, 의존성에서 제외함으로써 최종 결과물의 크기를 줄일 수 있음. 배포할 때 어떤 라이브러리가 포함되는지 구분해서 설치해 줘야 빌드 시간도 줄이고, 배포할 때 불필요한 라이브러리를 포함시키지 않아도 됨.

profile
후론트엔드 개발자를 꿈꿔요 💭

0개의 댓글