リアクションレールでファインアップローダーを使用する

Question

私は反応でfineuploaderを使用しようとしており、すべての関連する依存関係をインストールしています。続き は、私が使用するコードです： -

import React, { Component } from 'react' 
 

 
import FineUploaderTraditional from 'fine-uploader-wrappers' 
 
import Gallery from 'react-fine-uploader' 
 

 
import 'react-fine-uploader/gallery/gallery.css' 
 

 
const uploader = new FineUploaderTraditional({ 
 
    options: { 
 
     chunking: { 
 
      enabled: true 
 
     }, 
 
     deleteFile: { 
 
      enabled: true, 
 
      endpoint: '/uploads' 
 
     }, 
 
     request: { 
 
      endpoint: '/uploads' 
 
     }, 
 
     retry: { 
 
      enableAuto: true 
 
     } 
 
    } 
 
}) 
 

 
class UploadComponent extends Component { 
 
    render() { 
 
     return (
 
      <Gallery uploader={uploader} /> 
 
     ) 
 
    } 
 
} 
 

 
export default UploadComponent

しかし、私は、次のエラーを取得： -

Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in. Check the render method of `Gallery`. 
at invariant (invariant.js?7313:44) 
at instantiateReactComponent (instantiateReactComponent.js?e676:74) 
at instantiateChild (ReactChildReconciler.js?c86a:44) 
at eval (ReactChildReconciler.js?c86a:71) 
at traverseAllChildrenImpl (traverseAllChildren.js?5edf:77) 
at traverseAllChildrenImpl (traverseAllChildren.js?5edf:93) 
at traverseAllChildrenImpl (traverseAllChildren.js?5edf:93) 
at traverseAllChildren (traverseAllChildren.js?5edf:172) 
at Object.instantiateChildren (ReactChildReconciler.js?c86a:70) 
at ReactDOMComponent._reconcilerInstantiateChildren (ReactMultiChild.js?e1f8:185) 

警告：React.createElement：タイプが無効です - 文字列 （組み込みコンポーネント用）またはクラス/関数（複合語用 コンポーネント用）がありますが、未定義です。 コンポーネントを定義したファイルからエクスポートするのを忘れた可能性があります。 `Gallery`のレンダリング方法を確認してください。 （UploadComponentによって作成された）ギャラリーで

UploadComponent

で私はfineuploaderドキュメントを反応させ、次のしてきたと私はいくつかの異なるものを試してみたが、何も動作していないようにみえます。

Answer 1

問題は、私の場合にあったいくつかの満たされていない依存関係、ある内Galleryをwrapingしてみてくださいあった

react-transition-group@2.x 

2.xを削除して1.2.1をインストールすると問題が解決しました。

構成しようとしているパッケージのインストールの依存関係に注意してください。

反応の良いアップロードのオーナーrnicholusのおかげで助けになりました。

Answer 2

モジュールからGalleryコンポーネントをインポートする必要があると思います。

import Gallery from 'react-fine-uploader'

更新：

react-transition-group@1.x 

私は：
また、divの

class UploadComponent extends Component { 
    render() { 
     return (
      <div> 
      <Gallery uploader={uploader} /> 
      </div> 
     ) 
    } 
}