React.createElement:类型无效–应为字符串

试图让react路由器(v4.0.0)和react热加载程序(3.0.0-beta.6)正常运行,但在浏览器控制台中出现以下错误:

警告:React.createElement:类型无效--应为字符串
(对于内置组件)或类/函数(对于复合
组件)但得到:未定义。您可能忘了导出您的
组件,该组件来自定义它的文件。

index.js:

从“React”导入React;
从“react dom”导入react dom;
从“/routes.js”导入路由;
require('jquery');
导入'bootstrap/dist/css/bootstrap.min.css';
导入'bootstrap/dist/js/bootstrap.min.js';
导入“/css/main.css”;
const renderap=(批准)=>{
render(appRoutes,document.getElementById('root');
};
renderApp(routes());

routes.js:

从“React”导入React;
从“react hot loader”导入{AppContainer};
从“react Router”导入{Router,Route,browserHistory,IndexRoute};
从“./store/store.js”导入存储;
从'react redux'导入{Provider};
从“/containers/App.jsx”导入应用程序;
从“/containers/shop/Products.jsx”导入产品;
从“/containers/shop/Basket.jsx”导入篮子;
常数路由=()=>(
<AppContainer>
<提供程序存储={store}>
<路由器历史={browserHistory}>
<路由路径=“/”组件={App}>
<索引路由组件={Products}/>
<路由路径="/basket"组件={basket}/>
</Route>
</Router>
</Provider>
</AppContainer>
);
导出默认路径;

大多数情况下,这是由于不正确的导出/导入。

常见错误:

//文件:LeComponent.js
导出类LeComponent扩展React.Component{…}
//文件:App.js
从“/LeComponent”导入LeComponent;

可能的选择:

//文件:LeComponent.js
导出默认类LeComponent扩展React.Component{…}
//文件:App.js
从“/LeComponent”导入LeComponent;

有几种方法可能是错误的,但这种错误是因为每次有60%的时间是由于导入/导出不匹配造成的

编辑

通常,您应该获得一个stacktrace,该stacktrace指示故障发生的大致位置。这通常紧跟在你的原始问题中的信息之后

如果它没有显示,那么可能值得调查原因(可能是您缺少的构建设置)。不管怎样,如果没有显示,唯一的方法就是缩小导出/导入失败的范围

不幸的是,在没有堆栈跟踪的情况下,唯一的方法是手动删除每个模块/子模块,直到不再出现错误,然后以自己的方式备份堆栈

编辑2

通过评论,这确实是一个导入问题,特别是导入一个不存在的模块

发表评论