bekam „Elementtyp ist ungültig: ein String erwartet“, wenn auf Server-Seite Rendering versuchen reagieren

Question

ich diesen Fehler:

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

Beim Versuch ReactDOMServer.renderToStaticMarkup zu verwenden.

Dies ist meine reagieren App:

"use strict"; 
import React from 'react' 

module.exports =() => { 
    return (
     <div></div> 
    ); 
}; 

Und dies ist mein Knoten Server Rendering-Code:

"use strict"; 
const path = require('path'); 
const webpack = require('webpack'); 
const React = require('react'), ReactDOMServer = require('react-dom/server'), 
DOM = React.DOM, body = DOM.body, div = DOM.div, script = DOM.script; 
webpack({ 
    target: "node", 
    entry: [ 
     path.resolve(__dirname, '../js', 'app.js'), 
    ], 
    module: { 
     loaders: [ 
      { 
       exclude: /node_modules/, 
       loader: 'babel', 
       test: /\.js$/, 
      }, 
     ] 
    }, 
    output: {filename: 'app.bundle.js', path: __dirname}, 
},() => { 
    const App = React.createFactory(require('./app.bundle.js')); 
    let html = ReactDOMServer.renderToStaticMarkup(body(null, 
     div({ 
      id: 'root', dangerouslySetInnerHTML: { 
       __html: ReactDOMServer.renderToString(App()) 
      } 
     }) 
    )); 
}); 

Hat jemand eine Idee, was diesen Fehler verursachen und wie dieses Problem beheben?

Vielen Dank im Voraus.

Answer 1

Es scheint, dass das Paket standardmäßig nicht mit commonjs kompatibel ist. Wie ich in webpack docs gelesen habe, müssen Sie libraryTarget:'commonjs2' Ihrem Ausgangsobjekt hinzufügen, um es zu tun.

So:

output: {filename: 'app.bundle.js', path: __dirname,libraryTarget:'commonjs2'}