如何防止多个React副本加载？

Question

在我以前的Meteor应用程序中,使用browserify和React,所有工作都在运行,直到我切换到meteor webpack.

我在我的meteor应用程序中使用react-select并且它工作得很好但是使用browserify我可以阻止多个反应来自加载,这可以防止我现在遇到的这个错误:

错误:不变违规:addComponentAsRefTo(...):只有ReactOwner可以有refs.您可能正在向未在组件__CODE__方法中创建的组件添加引用,或者您已加载多个React副本(详细信息:https://fb.me/react-refs-must-have-owner).

我的package.json看起来像这样:

Error: Invariant Violation: addComponentAsRefTo(...): Only a ReactOwner can have refs. You might be adding a ref to a component that was not created inside a component's `render` method, or you have multiple copies of React loaded (details: https://fb.me/react-refs-must-have-owner).

在webpack中是否有配置我可以使用外部调用？不完全确定这意味着什么,但评论说使用:

...

"dependencies": {
    "classnames": "^2.1.3",
    "lodash": "^3.10.0",
    "react": "^0.14.6",
    "react-dom": "^0.14.6",
    "react-mixin": "^2.0.1",
    "react-select": "^1.0.0-beta8"
  },

...

Answer 1

由于您使用webpack,您可以为加载反应添加别名,如下所示:

// In webpack.config.js

  resolve: {
    alias: {
      react: path.resolve('node_modules/react'),
    },
  },

这可以防止addComponentAsRefTo(...)错误并使我们的构建再次成功.但是,出于某种原因,测试构建仅在我们的CI环境中失败,因为它无法解析node_modules/react路径.不过,我认为你不太可能遇到这个问题.