什么是添加一个依赖项的反应在您的package.json反应组件的正确方法是什么?

我已经做了一些简单的可重复使用的反应组件,并想知道正确的方法来包括一个依赖,以反应在我的package.json用npm发布。

我目前正在这样做:

假设我的组件将使用最新版本的反应,我已经testing,并与该版本。 例如0.13.3

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

对于可重用组件:

  1. peerDependenciesdevDependencies一个react依赖。
  2. 永远不要dependencies放置一个react dependencies

peerDependencies指定您的可重用组件支持/需要哪个版本的React。 当使用npm 2时,这也会将React添加到要安装的模块列表中,但npm 3不再是这种情况。

devDependencies可确保在开发组件的同时运行npm install或在Travis或类似环境中运行testing时npm install React。

如果有人使用你的组件,但在自己的package.json有不同版本的React,那么React的安装会导致React的多个版本被安装 – 有多个版本的React不仅会增加版本,而且在不同版本时也会导致错误尝试互动。

选定的答案肯定是在这里规定的方法,但是我已经开始倾向于使用控制反转,而不是依赖npm对象依赖对我的库依赖关系,而且它对我很好。

如果您构build它们的function,库更容易。 维护导出单个函数的函数库似乎比较容易,这个函数接受一个拥有所有严重依赖项的对象,并导出一个包含每个库的对象(典型导出)。


图书馆“注入”

LIB / index.js

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

消费应用程序

app.js

 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参数的版本上编写一些断言。总的来说,以这种方式构build库不应该随时出现新的构build问题React的版本已经发布,并且更重要的是确保你不会让你的图书馆消费者捆绑多个版本的React和其他重型图书馆。 这种模式适用于npm链接(当我不使用这种模式时,我通常有16个以上的库从npm链接运行,同时遇到问题)。

在你的主应用程序中,我会build议你总是把你使用的反应,反应dom和任何反应的lib组件分解成一个供应商捆绑包(webpack),并把它标记为你的主包中的外部,这样你就不会无意中捆绑两个版本。

您可以在peerDependenciesdependencies react 。 不同之处在于,使用peerDependencies ,只会为使用您的软件包的软件包安装一次。 如果你把它放在dependenciesreact会被安装两次,一次使用你的软件包,一次使用你的软件包。

由于某些原因,反应似乎有利于peerDependencies 。 你显然不希望在你的Javascript包中有两个独立版本的react (如果你使用dependencies话默认情况下会发生),但是用npm dedupe很容易。

所以没有正确的方法去做, peerDependenciesdependencies工作。 使用dependencies更符合节点/ NPM的方式,但使用peerDependencies对于不知道npm dedupe软件包用户以及为什么需要使用peerDependencies更友善。