npm 패키지 게시에 대한 의존성이없는 모듈을 번들하는 방법

Question

최근에 React 구성 요소를 개발하여 게시하려고합니다. 이 패키지에서

,

"dependencies": { 
    "react": "^0.14.6", 
    "react-dom": "^0.14.6", 
    "react-timer-mixin": "^0.13.3" 
} 

내가 webpack 명령으로 패키지를 빌드 할 때, 나는 react, react-dom and react-timer-mixin을 포함하는 번들을 얻을 것이다.
이 연습에 대한 잘못된 것 같습니다 ...

따라서, 내 질문에 게시 의존성없이 패키지를 빌드하는 방법입니다.

* 주요 번들과 종속성을 구분하는 척 벤더 방법은 여러 번들 파일에 대한 것입니다. 하지만 제 요구 사항은 lib를 빌드하는 것입니다.

Answer 1

라이브러리를 빌드하는 경우 이러한 종속성을 externals으로 등록해야합니다.

요약하면 webpack 구성에 externals 속성을 추가하고 제외 할 모듈의 이름 (문자열)을 포함하는 배열로 설정하면됩니다.

더 복잡한 경우 가져 오기 시스템의 기능에서 종속성을 가져 오는 방법을 지정해야 할 수 있습니다. 객체를 사용하여이 작업을 수행 할 수 있습니다.

Here is the official example

:

module.exports = { 
    output: { 
     libraryTarget: "umd" 
    }, 
    externals: [ 
     "add", 
     { 
      "subtract": { 
       root: "subtract", 
       commonjs2: "./subtract", 
       commonjs: ["./math", "subtract"], 
       amd: "subtract" 
      } 
     } 
    ] 
} 

See here for more information about library and externals.

ES 2015 및 6을 사용하는 경우 원하는 (예 : 구성 요소) 대신 모듈 객체 인 라이브러리 내보내기에 문제가 발생할 수 있습니다. 그것을 해결하기 위해 Have a look at this question.

Answer 2

아마도 peerDependencies을 사용해야합니다. 그런 다음 게시 용 webpack없이 빌드 할 수 있습니다. ES6을 사용한다면 바벨 추출 단계 만 있으면됩니다. 이 같은

뭔가

babel ./src -d ./lib 

피어 종속성을 설치하는 종속성을 가지고 있어야 패키지를 사용하여 프로젝트를 알고 NPM 드릴 것입니다 종종 충분하다.