이번에 typing-text-animation 라이브러리를 직접 개발하면서 package.json에 대해 궁금한것이 많이 생겼다. 동시에 무심코 지나쳤던 기본 개발 지식의 부족함을 많이 느꼈던 것 같다. 그래서 궁금한 것들은 바로바로 찾아서 공부해보려고 한다.

dependencies와 devDependencies?

dependencies 에는 애플리케이션 동작과 연관된, devDependencies 에는 애플리케이션 동작과 직접적인 연관은 없지만, 이름 그대로 개발할 때 필요한 라이브러리이다.

dependencies와 devDependencies의 차이점

npm 정보에 나와 있는 dependences ! dependencies와 devDependencies이 두개의 차이는 무엇일까?

일단 위 두개는 설치 방법이 다르다.

devDependencies로 라이브러리를 설치하는 방법

npm install -D typing-text-animation

dependencies 에 설치된 라이브러리는 배포할 때 포함되지만 devDependencies 에 설치된 라이브러리는 개발할 때 필요한 라이브러리기 때문에 배포할 때 포함되지는 않는다.

나눠서 설치하면 좋은 점

이렇게 잘 구분을 해서 설치해줘야 빌드시간도 줄이고, 배포할 때 불필요한 라이브러리를 포함시키지 않아도 된다.

적용해 볼 것

typing-text-animation 라이브러리도 정리가 필요할 것 같다.

{
  "dependencies": {
    "react": "^버전",
    "react-dom": "^버전"
  },
  "devDependencies": {
    "@types/node": "^버전",
    "@types/react": "^버전",
    "@types/react-dom": "^버전",
    "typescript": "^버전"
  }
}

react-dom도 필요 없을 수도 ?

추가로 react-dom은 주로 웹 애플리케이션에서 리액트 컴포넌트를 브라우저의 DOM에 렌더링하기 위해 사용되는 것이다. 그러면 리액트 컴포넌트 라이브러리 자체는 react-dom 이 필요하지 않을 수 도 있겠다는 생각이 들었다.

배포한 라이브러리로 테스트를 해봐야겠다.

Reference

dependencies 와 devDependencies 차이