패키지에 반응하는 종속성을 추가하는 올바른 방법은 무엇입니까?반응 성분용 json

패키지에 반응하는 종속성을 추가하는 올바른 방법은 무엇입니까?반응 성분용 json

몇 가지 간단한 재사용 가능한 반응 컴포넌트를 만들었는데 패키지에 반응 의존성을 포함하는 올바른 방법을 알고 싶습니다.npm과 함께 퍼블리싱하기 위한 json.

현재 이 작업을 하고 있습니다.

컴포넌트가 최신 버전의 react를 사용하고 테스트를 마쳤으며 해당 버전에서 동작한다고 가정합니다.예를 들어 0.13.3

"peerDependencies": { 
  "react": "^0.13.3"
},

재사용 가능한 컴포넌트의 경우:

1. a를 넣다react둘 다에 대한 의존성peerDependencies그리고.devDependencies.
2. 절대 넣지 마세요.react에 대한 의존.dependencies.

---

peerDependencies는 재사용 가능한 컴포넌트가 지원 또는 필요로 하는 React 버전을 지정합니다.npm 2를 사용하면 설치할 모듈 목록에 React도 추가되지만 npm 3에서는 해당되지 않습니다.

devDependencies실행 시 React가 설치되도록 합니다.npm install컴포넌트를 개발하는 동안이나 Travis에 대한 테스트 또는 유사한 테스트를 실행하는 동안입니다.

놓는 것react에dependencies사용자의 컴포넌트를 사용하지만 다른 버전의 React가 있는 경우 여러 버전의 React가 설치됩니다.package.json- 여러 버전의 React가 있으면 빌드가 확장될 뿐만 아니라 다른 버전이 상호 작용하려고 할 때 오류가 발생합니다.

선택된 답변은 분명히 여기에 규정된 접근법입니다만, 저는 라이브러리 의존을 npm의 피어 의존에 의존하는 것보다 제어의 반전 사용을 선호하기 시작했습니다.또한 이것이 저에게 도움이 되었습니다.

라이브러리를 기능적으로 구축하면 더 쉬워집니다.의존성이 높은 객체를 받아들여 라이브러리의 일반적인 내보내기를 포함하는 객체를 내보내는 단일 함수를 내보내는 라이브러리를 유지 관리하는 것이 더 쉬워 보입니다.

---

라이브러리 '주입'

lib/index.displaces

export default ({ React }) => {
  const InjectedComponent = props => (
    <p style={{color: props.color}}>This component has no React npm dependencies.</p>
  )

  /** other stuff */

  return { InjectedComponent }
}

---

응용 프로그램 사용

app.module

import React from 'react'
import { render } from 'react-dom'

/** Import the default export factory from our library */
import createInjectedComponent from 'injected'

/** Call the factory, passing its dependencies (guaranteed to match what we're bundling) and get back our component */
const { InjectedComponent } = createInjectedComponent({ React })

render(<InjectedComponent color="blue" />, document.getElementById('root'))

---

컴포넌트가 특정 버전의 react 또는 기타 종속성에서만 동작하는 경우 전달되는 react 파라미터에 대해 버전 주위에 몇 가지 어사션을 작성할 수 있습니다.전반적으로 이러한 방식으로 라이브러리를 구축하면 React 버전이 공개될 때마다 나타나는 새로운 빌드 문제가 발생할 가능성이 낮아지고, 무엇보다 라이브러리 소비자가 React 및 기타 무거운 라이브러리를 여러 버전으로 번들하지 않도록 보장할 수 있습니다.이 패턴은 와 잘 어울립니다.npm으로 16개 link일 （ ） 。npm이 패턴을 사용하지 않았을 때 발생한 문제와 동시에 발생한 문제를 링크합니다.)

을 하는 것을 합니다.react,react dom및 사용하는 모든 react lib 컴포넌트를 벤더번들(Webpack)에 삽입하여 메인번들로 외부로 마크하여 의도하지 않게2개의 버전을 번들하지 않도록 합니다.

당신은 가질 수 있다react 쪽이든peerDependencies ★★★★★★★★★★★★로dependencies,다르다,.peerDependencies,react는 패키지를 사용하여 패키지에 대해 한 번만 설치됩니다.dependencies,react패키지를 사용하여 패키지에 대해 한 번, 패키지에 대해 한 번, 패키지에 대해 한 번 두 번 설치됩니다.

가 호감을 주는 것 .peerDependencies웬일인지 그래.두 개의 된 버전을 않을 입니다.react으로 Javascript 사용 시 합니다)dependencies） 、 , 、 이 、 이 、 이 、 이 ), ), ), ), ), ), ), ), ), ), ), ), ), ), ), ), ), ), ), ), ), ), ), ), ), ), ), npm dedupe.

둘 다 방법이 peerDependencies ★★★★★★★★★★★★★★★★★」dependencies 업업을 사용해서. 사용dependencies 방식에 하지만 "/NPM"을 합니다.peerDependencies를 모르는 패키지 더 .npm dedupe왜 필요한지에 대해서요

언급URL : https://stackoverflow.com/questions/30451556/what-is-the-correct-way-of-adding-a-dependency-to-react-in-your-package-json-for