Question

我用故事书制作了一个项目，在那里我添加了一些组件。当我尝试在另一个项目中使用这些组件时，我收到错误

未捕获错误：addComponentAsRefTo（...）：只有ReactOwner可以有refs。您可能正在向未在组件的render方法中创建的组件添加引用，或者您已经加载了多个React副本。

我将故事书构建为

"build": "babel components --out-dir dist-es6 --source-maps inline",

我的.babelrc看起来像这样：

{
"presets": [
  "es2015",  // whichever presets your projects use should match here
  "stage-0",
  "react"
],
"plugins": [
  "transform-runtime", // for polyfills
  "transform-react-remove-prop-types" // we use this to remove the propTypes
]}

我使用index.js文件导出我的组件，如下所示：

export { default as DateFilter } from './DateFilter';

我包含组件：

import { DateFilter } from 'storybook/dist-es6';

我在故事书中做了一个nmp链接，以便在我的项目中使用它。我可以看到该组件，但它因未被捕获的错误而失败。

怎么办？

Answer 1

问题是故事书和nwb的组合问题。故事书和我使用的项目都有反应，所以我需要忽略故事书中使用的反应。

这已添加到nwb.config.js文件

aliases: {
   react: path.resolve('./node_modules/react'),
   'react-dom': path.resolve('./node_modules/react-dom'),
   'prop-types': path.resolve('./node_modules/prop-types')
 },

最后我实际上删除了nwb：）

使用storybook中的组件时出现addComponentAsRefTo错误

1 个答案: