Question

我正在尝试使用react-router v2.0.0，当我使用import { Router, Route, browserHistory } from 'react-router'然后使用console.log(Router)时，我得到的路由器未定义。但是，当我记录Route时，它会输出正确的对象。

"use strict";

import React from 'react'
import { Router, Route, browserHistory } from 'react-router'
import Home from './pages/home.js'
import Entrance from './pages/Entrance.js'
import Courses from './pages/Courses.js'
import Quizzes from './pages/Quizzes.js'

console.log("conner", Router);
console.log("conner", Route);

module.exports = (
  <Router history={browserHistory}>
    <Route path="/" component={Home}>
      <Route path="entrance" component={Entrance} />
      <Route path="courses" component={Courses} />
      <Route path="quizzes" component={Quizzes} />
    </Route>
  </Router>
);

这一切导致此控制台错误：Uncaught Invariant Violation: ReactDOM.render(): Invalid component element. This may be caused by unintentionally loading two independent copies of React

我做错了什么？

Answer 1

您是否已进入node_modules并进入react-router以检查其package.json中的版本？

Answer 2

如果你进入你的web项目的目录，你只需输入：npm ls | grep反应。

如果你看到多次出现反应，那么你就会遇到依赖性问题，因为有些模块在旧版本的基础上安装了较新版本的反应，这会破坏所有内容。

你可以试试npm shrinkwrap，npm prune，修复你的package.json。

你可以参考这篇关于shrinkwrap的帖子： http://javascript.tutorialhorizon.com/2015/03/21/what-is-npm-shrinkwrap-and-when-is-it-needed/

导入后，路由器在react-router v2.0.0中未定义

2 个答案: