不变违规:在es6导入中使用React-Dom renderToString()时出错

时间:2018-05-24 18:10:04

标签: reactjs express es6-modules serverside-rendering react-dom-server

这个问题完全不同,因为我搜索了很多相似但没有找到任何我正在创建反应服务器端渲染功能的项目并使用webpack编写es6代码和babel来编译{{1 }。在我的快速路线中,我想将jsx组件转换为字符串,然后想要传递给静态html部分。我这样做的时候工作正常

App

但现在当我希望App组件在这里时它不起作用

  var App = renderToString(<h1> Working Fine now </h1>);

我正在这样的快递服务器中导入App组件

var App = renderToString(<App />); // Not working

我的App.js

    import React from "react";
    import ReactDOMServer , {renderToString} from "react-dom/server";
    import  App  from '../common/component/App.js';

错误

  

不变违规:元素类型无效:期望一个字符串(对于内置组件)或一个类/函数(对于复合组件)但得到:undefined。

我在Github也检查了一些问题,但他们建议转向react-0.14,因为这些问题已经过时但我现在正在使用反应16

1 个答案:

答案 0 :(得分:0)

因为您已经在Line No 3

导入了应用

import App from '../common/component/App.js';

因此,要解决您的问题,请更换此行

var App = renderToString(<App />); // Not working

用这个

let MyApp = renderToString(<App />); // Working