React 路由器的 React.createElement 错误答案

【问题标题】：React.createElement error with React RouterReact 路由器的 React.createElement 错误
【发布时间】：2016-01-10 21:24:52
【问题描述】：

代码：

import React from 'react'
import { render } from 'react-dom'
import { Router} from 'react-router'
 render((
  <Router>
  </Router>
 ), document.getElementById('app'))

给出错误：

Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass 

Uncaught Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.

我正在使用带有 Babel6 的 Browserify - 这是 babelrc：

{
  "presets": ["es2015", "react"],
  "env": {
    "development": {
      "plugins": [
        ["react-transform", {
          "transforms": [{
            "transform": "livereactload/babel-transform",
            "imports": ["react"]
          }]
        }]
      ]
    }
  }
}

还有 package.json 部门：

"axios": "^0.8.1",
"babel-core": "^6.3.26",
"babel-loader": "^6.2.0",
"babel-plugin-react-transform": "^2.0.0-beta1",
"babel-plugin-transform-es2015-arrow-functions": "^6.3.13",
"babel-plugin-transform-react-jsx": "^6.3.13",
"babel-plugin-transform-runtime": "^6.3.13",
"babel-polyfill": "^6.3.14",
"babel-preset-es2015": "^6.3.13",
"babel-preset-react": "^6.3.13",
"babel-preset-stage-0": "^6.3.13",
"babel-preset-stage-2": "^6.3.13",
"babel-runtime": "^6.3.19",
"babelify": "^7.2.0",
"browserify": "^12.0.1",
"livereactload": "^2.1.0",
"react": "^0.14.5",
"react-addons-linked-state-mixin": "^0.14.5",
"react-dom": "^0.14.3",
"react-hot-loader": "^1.3.0",
"react-mixin": "^1.1.0",
"react-proxy": "^1.1.2",
"react-redux": "^4.0.6",
"react-router": "^1.0.3",
"react-simple-router": "^0.1.6",
"reactify": "^1.1.1",
"redux": "^3.0.5",
"redux-devtools": "^3.0.1",
"redux-devtools-dock-monitor": "^1.0.1",
"redux-devtools-log-monitor": "^1.0.1",
"redux-form": "^4.0.7",
"redux-simple-router": "^1.0.2",

浏览配置：

var props = {
entries: [script],
cache: {},
packageCache: {},
plugin: isProd ? [] : (watch ? [watchify, livereactload] : [livereactload]),
transform: [
  ['babelify', {
    presets: ['es2015', 'react'],
    plugins: [
      ['react-transform', {
        'transforms': [{
          'transform': 'livereactload/babel-transform',
          'imports': ['react']
        }]
      }]

    ]
  }],
  [envify, {}]
],
extensions: ['.jsx', '.js'],
debug: !isProd,
fullPaths: !isProd // for watchify
}

建议？我在 GH 上发现了很多问题，但没有明确的解决方案。这是从 React Router 站点上的示例中取出的，所以不知道为什么我不能让它工作。唯一的区别是他们使用 webpack。

【问题讨论】：

我应该使用什么版本？这是今天直接来自 npm 的 1.0.3
请注意，如果您有 .babelrc，您可能不需要在 browserify 配置中复制它。
@FélixSaparelli 啊是的 - 甚至没有意识到。我经历了 webpack 的噩梦并放弃了，所以这是我的工作但未清理的配置:)
我相信<Router>不能为空。

标签： javascript reactjs react-router

【解决方案1】：

这个问题很奇怪 - 感谢评论，我能够解决它。我有一个 .babelrc 配置以及一个带有自己的 babel 配置的 browserify gulp 作业。出于某种原因，两者都造成了这个问题。我在 gulp 中删除了一个，现在一切正常。原因：我的想法为零。

【讨论】：