[Setting] dependencies와 devDependencies의 차이

• package.json에서 dependencies 와 devDependencies 속성이 존재한다.

  • 차이를 구분할 때 기준점을 패키지의 종류와 설치 목적에 따라 갈라진다.

    간략 차이점

  • dependencies : 실행될 때 반드시 필요한 패키지

    • vue, express …

  • devDependencies : 개발 과정 에서만 필요한 패키지

    • typescript, eslint …

dependencies

• 프로젝트가 실행될 때 반드시 필요한 패키지들이 들어가는 곳
• 배포 후 에도 해당 패키지들이 필요함

{
  "dependencies": {
    "vue": "^3.2.0",
    "axios": "^1.5.0"
  }
}

devDependencies

• 프로젝트를 개발할 때만 필요한 패키지들이 들어가는 곳
• 배포 시에는 필요하지 않기 때문에, 프로덕션 빌드에서는 제외

{
  "devDependencies": {
    "typescript": "^5.2.0",
    "eslint": "^8.50.0",
    "vite": "^4.3.0"
  }
}

Typescript는 왜 devDependencies?

• Typescript는 빌드(컴파일) 때만 필요하기 때문이다.
• 즉, 배포에는 컴파일된 Javascript 만 배포되기 때문

그러나

무조건적으로 어떤 패키지는 dependencies나 devDependencies에 속하지는 않는다.

통상적으로는 목적과 분류에 따라 다르겠지만, 예를 들어 Typescript를 런타임 때까지 필요한 어떤 프로젝트를 진행할 때 필요할 수도 있다.

그렇기에 패키지 관리를할 때 구분하여 정리하는 것이 필요해 보인다.