npm dedupe로 모듈 중복 제거

프론트를 개발할 때 자신의 라이브러리를 모은 로컬 모듈을 만들 수 있습니다.
그럴 때 로컬 모듈에 의존하고 있는 모듈과 사용측에서의 모듈이 중복되어 버리는 경우가 있습니다.

예를 들면 다음과 같습니다.
parent (depends on [email protected])
 ├ node_modules
 |  └ [email protected]
 └ local_modules
    └ child (depends on hoge@~1.0.9)
       └ node_modules
          └ [email protected]

모듈에 따라서는 중복해 번들해 버린다고 생각하지 않는 동작을 해 버립니다.
(자신의 환경에서는 Vue.js가 중복되어 번들되어 버려 에러가 되었다 )

그런 중복을 해결해 주는 편리 명령이 npm dedupe 입니다.
htps : // / cs. 음 pmjs. 코 m/cぃ/데즈페

위의 구성으로 npm dedupe를 실행하면 다음과 같이 해소됩니다.
parent (depends on [email protected])
 ├ node_modules
 |  └ [email protected]
 └ local_modules
    └ child (depends on hoge@~1.0.9)

주의점으로서는 로컬 모듈을 webpack등을 사용해 빌드할 때에 의존 모듈을 밖으로부터 읽어들이도록(듯이) 설정해 주세요.
빌드 된 js 파일에 모듈이 포함되어 있으면 의미가 없으므로

webpack에서 모듈을 외부 참조하는 방법은 externals



npm이 아니라 yarn 사용하면 중복이 없습니다.

참고 사이트



h tp // 요스케-후루카와. 하테나 bぉg. 코m/엔트리/2014/06/10/100410
htps : // / cs. 음 pmjs. 코 m/cぃ/데즈페
htps : // 이 m / 어리석은 / ms / 4fb46 a c7f5 a f2에서 2fb
htps : // 또는 rn pkg. 코 m/ぁg/엔/도 cs/cぃ/데즈페/

좋은 웹페이지 즐겨찾기