文字列（組み込みコンポーネント用）またはクラス/関数（複合コンポーネント用）が必要ですが、未定義

Question

このエラーが発生しています。私はindex.js内のすべてのコンポーネントを定義しており、私はreact-router v4を使用しています。 エラー：要素タイプが無効です：文字列（組み込みコンポーネントの場合）またはクラス/関数（複合コンポーネントの場合）が必要ですが、未定義です。コンポーネントが定義されているファイルからコンポーネントをエクスポートするのを忘れた可能性があります。Appというレンダリング方法を確認してください。

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import {BrowserRouter as Router, Match, Link} from 'react-router' 

const Home =() => { 
    return (
     <div> 
      <h1>Welcome HOME!</h1> 
     </div> 
    ); 
}; 
const About =() => { 
    return (
     <div> 
      <h1>This is About .....</h1> 
     </div> 
    ); 
}; 
const Topics = ({pathname}) => { 
    return (
     <div> 
      <h2>Topics </h2> 
      {pathname} 
     </div> 
    ); 
}; 
    const App =() => { 
    return (
    <div> 
    <Router> 
     <div> 
     <ul> 
      <li><Link to='/'>Home</Link></li> 
      <li><Link to='/about'>About</Link></li> 
      <li><Link to='/topics'>Topics</Link></li> 
     </ul> 
     <hr/> 
     <Match pattern='/' component={Home} /> 
     <Match pattern='/about' component={About} /> 
     <Match pattern='/topics' component={Topics} /> 
     </div> 
    </Router> 
    </div> 
);} 

ReactDOM.render(
    <App />, 
    document.getElementById('root') 
); 

Answer 1

react-routerのalpha/betaリリースを使用していて、安定版v4リリースにアップグレードしましたか？反応-ルータのアルファおよびベータ版に比べ

、安定したv4のリリースで、彼らはRouteにMatchと改名し、それらがコアとDOMサブパッケージにパッケージを分割（のような反応しない）

変更しようその安定した文書の例を反映するためにあなたの輸入：あなたの輸入のいずれかが欠落しているため

import { BrowserRouter as Router, Route, Link } from 'react-router-dom' 

は、あなたが得るエラーがあると、あなたは実際に代わり、コンポーネントクラスの未定義の値を取得します。