Реагирование на нарушение рендеринга на стороне сервера: недопустимый тип элемента - PullRequest
Новая
       3

Реагирование на нарушение рендеринга на стороне сервера: недопустимый тип элемента

0 голосов
/ 13 марта 2019

Я пытаюсь создать компонент React с использованием синтаксиса модуля ES6 и не могу заставить его работать.Я создаю экспресс-приложение с помощью генератора экспрессов и создаю простой компонент: 

import React from 'react';

const Test = (props) => {
  return (
    <h1>Testing 1, 2, 3!</h1>
  );
}

export default Test;

Сохраняется в компонентах / Test.jsx

Затем в маршрутах / index.js: 

var express = require('express');
var router = express.Router();
const React = require('react');
const ReactDOMServer = require('react-dom/server');

// Transpile and add the React Component
require("@babel/register")({
  presets: [
    '@babel/preset-react',
    '@babel/preset-env'
  ]
});
const Test = React.createFactory(require('../components/Test.jsx'));

/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express',
    component: ReactDOMServer.renderToString(Test()) });
});

module.exports = router;

Поэтому я использую @ babel / register как require() ловушка для babel.preset-react для JSX и preset-env для ES6.Но все, что я получаю, это: 

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

Если я использую CommonJS с Компонентом, он работает нормально.Но ES6, нет.Есть идеи почему?

...