使用故事書中的組件時出現addComponentAsRefTo錯誤

Question

我使用故事書製作了一個項目，其中添加了一些組件。 當我嘗試在另一個項目中使用這些組件我得到一個錯誤

Uncaught Error: 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.

我作爲構建

"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'; 

我包括組件：我的故事書一NMP鏈接，以便在我的項目使用它

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

。我可以看到組件，但是它會因未捕獲的錯誤而失敗。

怎麼辦？

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 :)